DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> Sass教程 >> 6.6 本章總結
6.6 本章總結
編輯:Sass教程     

    Sass作為一門編程式的語言,也有屬於自己的一套流程控制語法。

    • (1)@if語句;
    • (2)@for循環;
    • (3)@while循環;
    • (4)@each循環;

    一、@if語句

    在Sass中,我們可以使用“@if語句”來進行條件選擇判斷。Sass的條件選擇語句共有3種:

    • (1)@if…(單向選擇);
    • (2)@if…@else…(雙向選擇);
    • (3)@if…@else if…(多向選擇);

    二、@for循環

    在Sass中,我們可以使用“@for”來實現循環操作。其中,Sass中的@for循環有2種方式。

    語法:

     
    方式1:@for $i from 開始值 through 結束值
    方式2:@for $i from 開始值 to 結束值
    

    說明:

    這2種方式是相似的,唯一的區別是:方式1包括結束值,方式2不包括結束值。其中“開始值”和“結束值”都是正整數。

    三、@while循環

    在Sass中,我們也可以使用@while語句來實現循環操作。跟JavaScript一樣,@while語句既是循環語句,也是條件判斷語句。

    語法:

     
    @while(判斷條件)
    {
        執行語句;
    }
    

    說明:

    在Sass中,沒有類似於JavaScript的“do...while...”這種語句。這一點小伙伴們要注意一下。

    四、@each循環

    除了@for以及@while這2種循環方式之外,Sass還為我們提供了另外一種循環方式:each循環。Sass中的each循環跟jQuery中的each循環很相似,大家對比一下。

    語法:

     
    @each $var in 列表值
    {
        ……
    }
    

    說明:

    $var是一個變量,也可以根據後面列表值表示的內容需要寫成$item、$color等。列表值,是Sass中的一種數據類型,可以稱之為“Sass中的數組”。

     

    XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
    Copyright © DIV+CSS佈局教程網 All Rights Reserved