标签:
在scss文件中使用@import。它不同于css中的@import。
css中的@import会有两个弊端:
1、必须放在代码的最前边
2、对性能不利
在scss文件中的@import使用CSS原生@import的既定规则
1、当@import 后面跟的是以.css文件结尾的时候
2、当@import 后面跟的是以http://开头的字符串
3、当@import 后面跟的是url()函数的时候
4、当@import 后面带有media queries的时候
scss都会认为你想使用原生css的@import
两个sass的既定规则
1、当@import 后面的文件没有后缀名的时候
sass会添加.scss或者.sass的后缀
2、同意目录下,局部文件和非局部文件不能重名
sass的变量操作
1、直接操作变量,即变量表达式
2、通过函数
1、跟代码块无关的函数,多是自己内置函数,称为functions
2、可重用的代码块,称为mixin
1、通过@include的方式调用
2、通过@extend的方式调用
以上两种方式都可以继承多个选择器
extend 不可以继承选择器序列
使用%,用来构建只用来继承的选择器
sass中的@media跟css的区别
sass中的@media query可以内嵌在css规则中
在生成css的时候
media query才会被提到样式的最高层级
好处:避免重复书写选择器或打乱样式表的流程
在嵌套的时候使用sass的at-root指令
明确指定被嵌套的内容输出到样式顶层
标签:
原文地址:http://www.cnblogs.com/huangcan/p/4677989.html