簡介:Sass又名SCSS,是CSS預(yù)處理器之一,它能讓你更好的、更輕松的工作。這個系列教程是《sass基礎(chǔ)篇》課程的進(jìn)級,對Sass其它較有難度的部分進(jìn)行講解,包括常用控制命令、函數(shù)及規(guī)律。
第1章 Sass的控制命令
Sass中控制命令指的是@if、@each、@for和@while。具有一定的邏輯判斷和循環(huán)遍歷能力,這個對于懂JavaScript或者后端語言的同學(xué)來說一點都不難。但在CSS中是不可思議的一件事情,最起碼到目前為止是不太可能的事情。但在Sass這樣的CSS預(yù)處理器語言中實現(xiàn)了。
第2章 Sass的函數(shù)功能-字符串與數(shù)字函數(shù)
本章節(jié)講解Sass字符串與數(shù)字函數(shù)。
- 編程: 2-1 Sass的函數(shù)簡介
- 編程: 2-2 字符串函數(shù)-unquote()函數(shù)
- 編程: 2-3 字符串函數(shù)-quote()函數(shù)
- 編程: 2-4 字符串函數(shù)-To-upper-case()、To-lower-case()
- 編程: 2-5 數(shù)字函數(shù)簡介
- 編程: 2-6 數(shù)字函數(shù)-percentage()
- 編程: 2-7 數(shù)字函數(shù)-round()函數(shù)
- 編程: 2-8 數(shù)字函數(shù)-ceil()函數(shù)
- 編程: 2-9 數(shù)字函數(shù)-floor()函數(shù)
- 編程: 2-10 數(shù)字函數(shù)-abs()函數(shù)
- 編程: 2-11 數(shù)字函數(shù)-min()函數(shù)、max()函數(shù)
- 編程: 2-12 數(shù)字函數(shù)-random()函數(shù)
第3章 Sass的函數(shù)功能-列表函數(shù)
本章節(jié)講解Sass列表函數(shù)。
- 編程: 3-1 列表函數(shù)簡介
- 編程: 3-2 length()函數(shù)
- 編程: 3-3 nth()函數(shù)
- 編程: 3-4 join()函數(shù)
- 編程: 3-5 append()函數(shù)
- 編程: 3-6 zip()函數(shù)
- 編程: 3-7 index()函數(shù)
- 編程: 3-8 Introspection函數(shù)
- 編程: 3-9 Introspection 函數(shù) -type-of()
- 編程: 3-10 unit()函數(shù)
- 編程: 3-11 unitless()函數(shù)
- 編程: 3-12 comparable()函數(shù)
- 編程: 3-13 Miscellaneous函數(shù)
- 編程: 3-14 Map
- 編程: 3-15 Sass Maps的函數(shù)
- 編程: 3-16 Sass Maps的函數(shù)-map-get($map,$key)
- 編程: 3-17 Sass Maps的函數(shù)-map-has-key($map,$key)
- 編程: 3-18 Sass Maps的函數(shù)-map-keys($map)
- 編程: 3-19 Sass Maps的函數(shù)-map-values($map)、map-merge($map1,$map2)
- 編程: 3-20 Sass Maps的函數(shù)-map-remove($map,$key)、keywords($args)
第4章 Sass的函數(shù)功能-顏色函數(shù)
本章講解Sass中自帶的顏色函數(shù)。
- 編程: 4-1 RGB顏色函數(shù)-RGB()顏色函數(shù)
- 編程: 4-2 RGB顏色函數(shù)-RGBA()函數(shù)
- 編程: 4-3 RGB顏色函數(shù)-Red()、Green()、Blue()函數(shù)
- 編程: 4-4 RGB顏色函數(shù)-Mix()函數(shù)
- 編程: 4-5 HSL函數(shù)簡介
- 編程: 4-6 HSL函數(shù)-lighten()
- 編程: 4-7 HSL函數(shù)-saturate()
- 編程: 4-8 HSL函數(shù)-adjust-hue()函數(shù)
- 編程: 4-9 HSL函數(shù)-grayscale()函數(shù)
- 編程: 4-10 Opacity函數(shù)簡介
- 編程: 4-11 Opacity函數(shù)-alpha()、opacity()函數(shù)
- 編程: 4-12 Opacity函數(shù)-rgba()函數(shù)
- 編程: 4-13 Opacity函數(shù)-opacify()、fade-in()函數(shù)
- 編程: 4-14 Opacity函數(shù)-transparentize()、 fade-out()函數(shù)
- 編程: 4-15 顏色函數(shù)實戰(zhàn)——七色卡
第5章 Sass 的 @ 規(guī)則
Sass 支持所有 CSS3 的 @ 規(guī)則, 以及一些 Sass 專屬的規(guī)則,也被稱為“指令(directives)”。 這些規(guī)則在 Sass 中具有不同的功效。這一章就為大家講解。