S.N.	數(shù)據(jù)類(lèi)型及說(shuō)明	示例
1	Numbers 它代表整數(shù)類(lèi)型	2, 10.5
2	Strings 單或雙引號(hào)中定義的字符序列	'Yiibai', "yiibai"
3	Colors 用于定義顏色值	red, #008000, rgb(25,255,204)
4	Booleans 布爾類(lèi)型返回true或false	10 > 9 指示為 true
5	Nulls 它指定為空值，未知的數(shù)據(jù)	if(val==null) {//statements}
6	Space and Comm 表示由空格或逗號(hào)分隔值	1px solid #eeeeee, 0 0 0 1px
7	Mapping 它從一個(gè)值映射到另一個(gè)值	FirsyKey: frstvalue, SecondKey: secvalue

字符串

字符串是一系列單或雙引號(hào)字符。用單引號(hào)或雙引號(hào)定義的字符串將通過(guò)使用#{}插補(bǔ)(選擇使用變量的一種方式)被顯示為不帶引號(hào)的字符串值。

示例

下面的例子演示了在SCSS文件中使用字符串：

<html>
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>字符串 - www.yiibai.com</title>
   <link rel="stylesheet" type="text/css" href="style.css" />
   <link rel="stylesheet" >
   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>
<body>
   <div class="container">
   <h2>字符串使用示例</h2>
   <p class="yiibai">Sass is an extension of CSS that adds power and elegance to the basic language.</p>
   </div>
</body>
</html>

接下來(lái)，產(chǎn)生一個(gè)文件：style.scss.

style.scss

$name: "yiibai";

p.#{$name} {
  color: blue;
}

你可以告訴SASS監(jiān)視文件，并隨時(shí)使用下面的命令更新SASS文件修改CSS：

sass --watch C:\Ruby22-x64\style.scss:style.css

接著執(zhí)行上面的命令，它會(huì)自動(dòng)創(chuàng)建style.css文件，下面的代碼：

style.css

p.yiibai{
  color: blue;
}

輸出結(jié)果

讓我們來(lái)執(zhí)行以下步驟，看看上面的代碼執(zhí)行結(jié)果：

保存上述的HTML代碼到strings.html文件。
在瀏覽器中打開(kāi)該HTML文件，輸出如下得到顯示。

Lists

列表指定使用空格或逗號(hào)，甚至單個(gè)值分隔的多個(gè)值被視為一個(gè)列表。Sass使用了一些的列表的功能，如：

nth 函數(shù): 它提供了列表的特定的項(xiàng)目
join 函數(shù): 它將多個(gè)列表加入成為一個(gè)列表
append 函數(shù): 追加的項(xiàng)目到列表的另一端
@each 指令: 它提供列表中每個(gè)項(xiàng)目的樣式

例如，考慮有兩種類(lèi)型的列表;第一個(gè)列表包含了使用逗號(hào)分隔如下列值。

10px 11px, 15px 16px

如果內(nèi)部列表和外部列表?yè)碛邢嗤姆指舴敲纯梢杂美ㄌ?hào)來(lái)指定兩份列表的開(kāi)始和結(jié)束。可以指定列表如下圖所示：

{10px 11px} {15px 16px}

Maps

映射是那些鍵用來(lái)表示鍵和值的組合。映射定義值成組，并且可以被動(dòng)態(tài)訪問(wèn)。映射表達(dá)式可以寫(xiě)為：

$map: (FirsyKey: frstvalue, SecondKey: secvalue, Thirdkey: thdvalue);

它使用的一些功能，如：

map-get: 提供映射的值。
map-merge: 它增加值到映射中
@each directive: 它規(guī)定了鍵/值對(duì)映射的樣式

映射沒(méi)有任何元素表示空鍵/值對(duì) ( ) ，使用inspect($value)函數(shù)來(lái)顯示輸出映射。

Colors

它是用于定義SassScript顏色值。例如，如果正在使用顏色代碼為#ffa500，那么它將會(huì)顯示為橙色壓縮模式。Sass提供類(lèi)型在無(wú)效語(yǔ)法時(shí)，顏色插值到選擇其它輸出模式相同的輸出格式。要克服這個(gè)問(wèn)題，使用顏色名稱在引號(hào)內(nèi)。

上一篇：Sass @each多重分配下一篇：Sass CSS擴(kuò)展

在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

Sass數(shù)據(jù)類(lèi)型