-
a{ &:hover{ color:blue; } } /*页面主体内容样式*/ .main-sec{ font-family: $main-sec-ff; .headline { font-family: $mian-sec-ff; font-size:16px; } .detail { font-size: 12px; } } 【属性嵌套】 .headline{ font: { family: $main-sec-ff; size: 16px; } }查看全部
-
【局部文件用_开头】 /* * CONTENTS * * SETTINGS * variables………………………变量集中存储文件 * mixin……………………………mixin集中存储文件 * * TOOLS * * COMPONENTS * reset……………………………Compass内置浏览器重置样式文件 * * BUSINESS * * * BASE * screen.scss…………………针对当前站点主页的样式修饰 * */查看全部
-
【css中原生@import指令2大弊端】 1.放在代码最前边 2.对性能不利 【使用css原生@import的既定规则】 1.当@import后边跟的文件名是以.css结尾时; 2.当@import后边跟的是 http://开头的字符串时; 3.当@import后边跟的是一个url()函数时; 4.当@import后边带有media queries时 @import "variables"; @import"compass/reset" ^ @import "variables", "compass/reset"; 【基于sass的既定规则】 1. 没有文件后缀名时,sass会添加.scss或.sass的后缀。 2.同一目录下,局部文件和非局部文件不能重名。查看全部
-
变量操作: 1.直接操作变量,即变量表达式。 2.通过函数。 2.1 跟代码块无关的函数,多是自己内置函数,称functions 2.2 可重用的代码块,称mixin @ include方式调用 @ extend方式调用查看全部
-
22:59:04 goodluck 2016/3/25 22:59:04 p{ height: ( 500px /2); //计算可带单位,用相同单位 color: hsl( 270, 100%, 50%); //360度色盘度数,饱和度,明度 } sass的function(用的很少) 网址:http://sass-lang.com/documentation/Sass/Script/Functions.html查看全部
-
_mixin.scss @mixin col-6 { width:50%; float:left; } @mixin col ($width: 50%) {//默认参数为50% width: $width; float:left; } screen.scss中调用_mixin.scss .webdemo-sec{ @include col();//不传参 &:hover { background-color: #f5f5f5; } } .webdemo-sec{ @include col(25%);//传参 &:hover { background-color: #f5f5f5; } }查看全部
-
mixin指令 名字 参数 @mixin name (params) { //此处是内容 }查看全部
-
extent两个知识点: 1.不可以继承选择器序列 2.使用%,用来构建只用来继承的选择器查看全部
-
只用来继承的类 %error{color:red;} .serious-error{ @extend %error; border:1px #f00; }查看全部
-
compass compile compass watch查看全部
-
gem install compass查看全部
-
sass main.scss main.css查看全部
-
gem install sass --version=3.3查看全部
-
sass 函数演示查看全部
-
mixin 参数校验查看全部
举报
0/150
提交
取消