less学习笔记之bootstrap目录说明源代码里面的目录是这样的(只给出部分): .csscomb.json│ .csslintrc│ alerts.less│ badges.less│ bootstrap.less│ breadcrumbs.less│ button-groups.less│ buttons.less│ carousel.less│ close.less│ …│└─mixins alerts.less background-variant.less border-radius.less buttons.less center-block.less clearfix.less forms.less gradients.less …文件 variables.less顾名思义,为整个Bootstrap定义的全局变量。知识点一:Less的作用域和css很相似,变量和混合(mixins)在当前文件无法找到时会继承父级作用,如果任然没有找到则会编译抛出异常。定义在Bootstrap中使用的灰色和品牌颜色。@gray-base: #000;@gray-darker:lighten(@gray-base, 13.5%);@gray-dark: lighten(@gray-base, 20%); @gray: lighten(@gray-base, 33.5%); // #555@gray-light: lighten(@gray-base, 46.7%); @gray-lighter: lighten(@gray-base, 93.5%); // 这部分定义的主要色:成功、失败、警告等等。@brand-primary: darken(#428bca, 6.5%); // #337ab7@brand-success: #5cb85c;@brand-info: #5bc0de;@brand-warning: #f0ad4e;@brand-danger: #d9534f;具体体现:知识点2:函数 lighten与darken描述: 参数:color, amount, method
功能: color + amount
表示在color
的基础上,变得更淡或者更深,加上method后表示在color * method
的基础上,变淡/深 amount,这里先不解释less中色值是怎么计算的。之后也定义了默认背景色。定义字体风格字体大小定义Bootstrap的基础字体为14px。知识点3:函数ceil和floor简单说明:分别为向上取整和向下取整输入框风格定义cursor:not-allowed //当button与input处于disabled时,鼠标指针的样式优先级定义设置一些默认层级优先级z-index,用于特定的组件,例如:navbar、dropdown、popover、modal-background、tooltip、navbar-fixed。值都为1000+,这也就是有时候我们自己自定义了一些优先级,但是还是达不到效果,可以想一想是不是值不够?