-
@mixin functionName {}
查看全部 -
sass 引入，
@import ‘zxc’ zxc 中 $z=zx
sth=z
查看全部 -
跨游覽器 normalize P，span等等
查看全部 -
sass @import 在編譯時，將背引入的文件整合到css中
查看全部 -
變量操作：
????1.直接操作變量，即變量表達式。
????2.通過函數。
跟代碼塊無關的函數，多是自己內置函數稱functions
可重用的代碼塊。稱mixin
通過復制拷貝的方式使用，通過@include方式調用
使用時以組合聲明方式存在，以@extend方式調用
——————————————————
H:60黃|120綠|180青|240藍|300洋紅|360紅
S(saturation)飽和度
L(lightness)亮度
——————————————————
@mixin通過@include引入
@mixin?col-6{ ????width:50%; ????float:left; }.webdemo-sec{ ????@include?col-6();//@mixin通過@include引入 ????&:hover{ ????????background-color:#f5f5f5;// ????} }帶參數mixin
@mixin?col?($width:?50%){//默認是50% ????width:$width }.webdemo-sec{ ????@include?col(50%);//引入時傳遞參數 ????&:hover{ ????????background-color:#f5f5f5;// ????} }繼承@extend
.error{ ??color:#f00; } .serious-error{ ??@extend?.error;//.serious-error插入到.error里 ??border:?1px?#f00; }查看全部 -
scss sass轉換
sass -convert main.scss main.sass
---------------------------------------------
文件加下劃線，局部文件
---------------------------------------------
@import"局部文件目錄"?
導入局部文件
@import所在的文件稱為宿主文件
---------------------------------------------
reset瀏覽器默認樣式全部清除
Normalize選擇性的剔除替換
---------------------------------------------
sass不但提供類的嵌套也提供了屬性的嵌套
.main-sec?{//一個空格在類選擇器后邊 ?font-family?{ ?????font：{ ???????family:$main-sec-ff;//@import導入文件的變量 ???????size:16px; ?????} ?} }?
查看全部 -
extend
查看全部 -
extend
查看全部 -
基于sass的既定規則
查看全部 -
使用css原生@improt的既定規則
查看全部 -
compass安裝
gem install compass?
查看版本
compass -v
創建compass框架
compass create 項目名稱
查看全部 -
早期的sass采用.sass后綴，這是一種類Ruby語言，對空格敏感，且沒有大括號。后來采用.scss后綴，和css語法很類似。
查看全部 -
sass: CSS with superpowers
查看全部 -
scss四種編譯格式
expanded nested compact compressed
查看全部 -
if
if not?
else?
media
查看全部
舉報