sasscore22
1、setting
如果不需要支持ie6,7,请在引入setting文件之前,设置$lte7:false;
。
$lte7: true !default 表示的是是否兼容it6/7
2、css3 是一些兼容性质的问题
@include border-image(url(img.png) 3 round);
@include box-shadow(0 0 5px rgba(11,22,33));
@include display-flex; flex-direction ; 等设置在父容器上面
@include flex(2);设置在子元素上面的
3、media是一些响应式布局的判断,对手机等兼容较好
4、mixin
@extend是联合声明的 @include是直接在选择器内生声明的
- // px转em
@function pxToEm($px, $base: 16) {
@return ($px / $base) * 1em;
}
// px转rem
@function pxToRem($px, $base: 40) {
@return ($px / $base) * 1rem;
}- // font-size自适应
@mixin font-dpr($font-size){
font-size: $font-size /2;
[data-dpr="2"] & {
font-size: $font-size;
}
[data-dpr="3"] & {
font-size: $font-size /2 * 3;
}
}- @mixin px2px($name,$font-size){
#{$name}: $font-size;
[data-dpr="2"] & {
#{$name}: $font-size * 2;
}
[data-dpr="3"] & {
#{$name}: $font-size * 3;
}
}
@mixin
通过@include
来调用;%
通过@extend
来调用;@function
则是返回一个值。
sasscore22的更多相关文章
随机推荐
- mybatis实战教程(mybatis in action)之六:与Spring MVC 的集成
前面几篇文章已经讲到了mybatis与spring 的集成.但这个时候,所有的工程还不是web工程,虽然我一直是创建的web 工程.今天将直接用mybatis与Spring mvc 的方式集成起来,源 ...
- Bootstrap,Font Awesome等组件中 .woff字体报404错的解决办法
参考资料:http://www.zhidao91.com/glyphicons-halflings-regular-woff-404-not-found/ http://shiyousan.com/p ...
- U-boot的目录结构及spl功能
转 http://tieba.baidu.com/p/2836672721 对uboot-2010.06及其以后的版本,将体系结构相关的内容合并,增加include文件夹,分离出通用库文件lib,其各 ...
- 利用SQL 建立和删除 LINKED SERVER
USE IS21_xxx; if object_id('tempdb..#tmp') is not null drop table #tmp create table #tmp ( cntr ), i ...
- Gradle脚本基础全攻略
http://blog.csdn.net/yanbober/article/details/49314255
- PHP取整函数:ceil,floor,round,intval的区别详细解析
floor -- 舍去法取整说明float floor ( float value ) 返回不大于 value 的下一个整数,将 value 的小数部分舍去取整.floor() 返回的类型仍然是 fl ...
- 更改yum源地址
1.进入yum配置文件目录:cd /etc/yum.repos.d/ 2.备份配置文件:mv CentOS-Base.repo CentOS-Base.repo.bak 3.下载网易的配置,改成网易的 ...
- Django RedirectView
RedirectView作用是重定向一个指定,给定的Url.这个给定的Url可能包含有字典风格的字符串,因为关键字(词)会被改变,所以从这个Url中捕获的参数可能也会被修改,例如,Url中的“%”应该 ...
- C++设计模式-Flyweight享元模式
Flyweight享元模式 作用:运用共享技术有效地支持大量细粒度的对象. 内部状态intrinsic和外部状态extrinsic: 1)Flyweight模式中,最重要的是将对象分解成intrins ...
- 剑指Offer:面试题29——数组中出现次数超过一半的数字(java实现)
PS:在前几天的面试中,被问到了这个题.然而当时只能用最低效的方法来解. 问题描述: 数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字.例如输入一个长度为9的数组{1,2,3,2,2,2, ...