layui-学习02-全局样式

CSS内置公共基础类

类名(class)

说明

布局

layui-main

用以安装二个宽度为 1140px 的品位居中块(无响应式)

layui-inline

用于将标签设为内联块状成分

layui-box

用来破除有个别UI框架(如Bootstrap)强制将全部成分设为box-sizing:
border-box所掀起的尺码偏差

layui-clear

用以破除浮动(一般不怎么常用,因为layui大概没用到浮动)

辅助

layui-icon

用以图标

layui-elip

用来单行文本溢出差不多

layui-unselect

用于屏蔽选中

layui-disabled

用以安装成分不可点击状态

layui-circle

用来安装成分为圆形

layui-show

用以展现块状成分

layui-hide

用来隐藏成分

Bootstrap,文本

layui-text

概念一段文本区域(如文章),该区域内的与众不一样标签(如a、li、em等)将会议及展览开对应处理

layui-word-aux

品绿标注性文字,左右会有距离

背景色

layui-bg-red

用以安装成分赤色背景

layui-bg-orange

用来安装成分铁黑背景

layui-bg-green

用来安装成分墨淡蓝背景(主色调)

layui-bg-cyan

用于安装成分藏灰白背景

layui-bg-blue

用以安装元素青黑背景

layui-bg-black

用来安装成分经典鲑鱼红背景

layui-bg-gray

用来安装成分经典青色背景

 

CSS命名规范

class命名前缀:layui,连接符:,如:class=”layui-form”

取名格式一般分为二种:

一:layui-模块名-状态或项目

二:layui-状态或项目

因为有点类并非是有个别模块所特有,他们平凡会是部分公共类。如:一(定义按钮的本来风格):class=”layui-btn
layui-btn-primary”、二(定义内联块状成分):class=”layui-inline”**

 

常用公共属性:

要素的为主交互行为,都以由模块自动开启。但差别的区域大概需求接触区别的动作,那就必要您设定大家所支撑的自定义属性来作为有别于。如上边的 lay-submitlay-filter即为公共属性(即以 lay- 作为前缀的自定义属性):<button
class=”layui-btn” lay-submit lay-filter=”login”>登入</button>

近期大家的公物属性如下所示(即普遍运用于全数因素上的性质)

属性 描述
lay-skin=" " 定义相同元素的不同风格,如checkbox的开关风格
lay-filter=" " 事件过滤器。你可能会在很多地方看到他,他一般是用于监听特定的自定义事件。你可以把它看作是一个ID选择器
lay-submit 定义一个触发表单提交的button,不用填写值

相关文章