<div class="control-group">
<label class="control-label" for="inputPassword">密码</label>
<div class="controls">
<input type="password" id="inputPassword" check-type="required" required-message="密码不能为空!" ></div>
</div>
<div class="control-group">
<div class="controls">
<button type="submit" class="btn">登录</button>
</div>
</div>
</form>
</div>
在bootstrap基础上,在input中
check-type 为需要验证的规则,可以绑定多个规则,之间用空格隔开。
required-message 为验证为通过显示的信息,在这里 required-message 的’-'之前为前面定义的验证规则名称。
在 Less 中, 我们可以定义一种叫 “mixins” 的东西 —— 和编程语言中的函数有一点的相似。在 Less 中, 它被用来灵活的组件化 CSS 中可重复使用的 class。 Mixin 允许你把一个 class 的所有属性嵌入到另外的一个 class 中 —— 就像它的一个属性一样, 仅仅通过简单的 include class 的名字。 它仅仅是一个变量,但是拥有一个 class 的属性。 任何的 CSS class 和 id 规则都可以混在里面。
.round-borders {
border-radius: 5px
-moz-border-radius: 5px
-webkit-border-radius: 5px
}
#menu {
color: gray
.round-borders
}
// 输出
.round-borders {
border-radius: 5px
-moz-border-radius: 5px
-webkit-border-radius: 5px
}
#menu {
color: gray
border-radius: 5px
-moz-border-radius: 5px
-webkit-border-radius: 5px
}
function函数是有计算逻辑,返回计算的结果,不输出css块
mixinmixin主要是计算根据计算结果输出css块
使用场景可以以下面为原则:
extend 继承:管理样式
mixin :管理属性
function :管理(计算)值