一、減法
二、加法
加號可以不需要空格隔開,test.sCSS中
1 $test-width1: 100px;2 $test-width2: 200px;3 $test-width3: 300px;4 5 .test {6 width: $test-width1+$test-width2+ $test-width3;7 margin: 0 auto;8 }test.css中的結果:1 .container {2 width: 600px;3 margin: 0 auto; }另外,加號還可以做字符串連接。帶引號的字符串在 + 號左側,結果是一個有引號的字符串;沒有引號的字符串在 + 號左側,結果是一個沒有引號的字符串。(如果中文亂碼,可在文件頭部寫入:@charset "UTF-8";)1 p:before {2 content: "Foo " + Bar;3 font-family: sans- + "serif";4 }結果:
1 p:before {2 content: "Foo Bar";3 font-family: sans-serif; }三、乘法能夠支持多種單位(比如 em ,px , %),多個數值只需要為一個數值提供單位即可,否則報錯。
四、除法
由于"/"在css中已有用途,因此需要在運算外層加上括號(),除法的使用情況總結,如下:
1 p {2 font: 10px/8px; // 純 CSS,不是除法運算3 $width: 1000px;4 width: $width/2; // 使用了變量,是除法運算5 width: round(1.5)/2; // 使用了函數,是除法運算6 height: (500px/2); // 使用了圓括號,是除法運算7 margin-left: 5px + 8px/2px; // 使用了加(+)號,是除法運算8 }
新聞熱點
疑難解答