前端开发规范手册
LESS
代码组织
代码按一下顺序组织：
1.@import
2.变量声明
3.样式声明
@import "mixins/size.less";
@default-text-color: #333;
.page {
width: 960px;
margin: 0 auto;
}
@import 语句
@import 语句引用的文需要写在一对引号内，.less 后缀不得省略。引号使用 ' 和 " 均可，但在同一项目内需统一。
/* Not recommended */@import "mixins/size"; @import 'mixins/grid.less';/* Recommended */@import "mixins/size.less"; @import "mixins/grid.less";
混入（Mixin）
1.在定义 mixin 时，如果 mixin 名称不是一个需要使用的 className，必须加上括号，否则即使不被调用也会输出到 CSS 中。
2.如果混入的是本身不输出内容的 mixin，需要在 mixin 后添加括号（即使不传参数），以区分这是否是一个 className。
/* Not recommended */.big-text {
font-size: 2em;
}
h3 {
.big-text;
.clearfix;
}/* Recommended */.big-text() {
font-size: 2em;
}
h3 {
.big-text(); /* 1 */
.clearfix(); /* 2 */}
避免嵌套层级过多
将嵌套深度限制在2级。对于超过3级的嵌套，给予重新评估。这可以避免出现过于详实的CSS选择器。
避免大量的嵌套规则。当可读性受到影响时，将之打断。推荐避免出现多于20行的嵌套规则出现。
字符串插值
变量可以用类似ruby和php的方式嵌入到字符串中，像@{name}这样的结构: @base-url: "http://assets.fnord.com"; background-image: url("@{base-url}/images/bg.png");
相关视频
24小时阅读榜
精品课程
独孤九贱(2)_CSS视频教程
共22课时
24.4万人学习
独孤九贱(3)_JavaScript视频教程
共28课时
36.3万人学习
独孤九贱(4)_PHP视频教程
共89课时
133.5万人学习
热门下载
phpStudy 2018最新版
集成PHP7，16种组合，超全大合集
下载
vc9-vc14（32+64位）运行库合集（链接在下方）
phpStudy安装所需运行库集合下载
下载
php程序员工具箱完整版
程序员工具箱 v1.0 php集成环境
下载
SublimeText3汉化版
中文版，非常好用
下载
Notepad++ Windows版
Notepad++ 8.9.7 Windows版官方安装包，适合 Windows 用户进行代码编辑、文本处理、语法高亮和插件扩展配置。
下载
phpStudy V8.1（Win64位）（已支持php8）
Win64位，支持php多版本共存
下载