(一)前端css预处理语言
(二)sass的安装以及在普通项目的使用
1.安装ruby
2.安装好sass和compass之后,新建一个测试项目
gem install sass
gem install compass
3.然后在项目根目录下打开命令执行compass watch,
compass watch是一个监听,当有sass内容变化时就会自动编译。
4.效果如下图所示
5.在index.html中引入
1. 混合器
@mixin rounded-corners{
-moz-border-radius:5px;
-wekit-border-radius:5px;
border-radius:5px;
}
在样式表中可以使用通过@include来使用这个混合器。
notice{
background-color:green;
border:2px solid #000;
@include rounded-corders;
}
最终形成正常的编译效果。
2。使用选择器继承来精简css
//通过选择器继承样式
.error{
border:1px solid red;
background-color:#000;
}
.seriousError{
@extend .error
border-width:3
}