简单辅助元素 - 页面元素

本篇主要集中罗列页面中的一些简单辅助元素，如：引用块、字段集区块、横线等等，这些元素都无需依赖任何模块

引用区块

辅助 引用 / 字段集 / 横线等 - 图1

目前内置了上述两种风格

  1. <blockquote class="layui-elem-quote">引用区域的文字</blockquote>
  2. <blockquote class="layui-elem-quote layui-quote-nm">引用区域的文字</blockquote>
  3.

字段集区块

辅助 引用 / 字段集 / 横线等 - 图2

同样内置了两种风格，另一种风格即该文档的标题横线：字段集一行

  1. <fieldset class="layui-elem-field">
  2.   <legend>字段集区块 - 默认风格</legend>
  3.   <div class="layui-field-box">
  4.     内容区域
  5.   </div>
  6. </fieldset>
  7.  
  8. <fieldset class="layui-elem-field layui-field-title">
  9.   <legend>字段集区块 - 横线风格</legend>
  10.   <div class="layui-field-box">
  11.     内容区域
  12.   </div>
  13. </fieldset>
  14. 你可以把它看作是一个有标题的横线
  15.

横线

辅助 引用 / 字段集 / 横线等 - 图3

  1. 默认分割线
  2. <hr>
  3.  
  4. 赤色分割线
  5. <hr class="layui-bg-red">
  6.  
  7. 橙色分割线
  8. <hr class="layui-bg-orange">
  9.  
  10. 墨绿分割线
  11. <hr class="layui-bg-green">
  12.  
  13. 青色分割线
  14. <hr class="layui-bg-cyan">
  15.  
  16. 蓝色分割线
  17. <hr class="layui-bg-blue">
  18.  
  19. 黑色分割线
  20. <hr class="layui-bg-black">
  21.  
  22. 灰色分割线
  23. <hr class="layui-bg-gray">
  24.

layui - 用心与你沟通