在此懇求說話無線迴圈的人（例如我媽)，求你行行好...改成有限迴圈，而且i < 3，口 以嗎？
這單純是為了寫範例而做的，真正在BootStrap裡的灰階，並不是這樣做的。下方範例是字體顏色+背景為rgba， ($i) 也可以直接寫成 $i ， 不過工程師說，用()包起來是好習慣，那就醬
語法範例SCSS
//gray字體顏色+背景
@for $i from 1 through 9 { //從 1 到 9 共執行 9 次。
.color-gray#{$i}00 {
color: rgba( 0,0,0,($i) /10 );
}
.bg-gray#{$i}00 {
background-color: rgba( 0,0,0,($i) /10 );
}
|
編譯後CSS
.te-color-gray100 { color: rgba(0, 0, 0, 0.1);}
.te-bg-gray100 { background-color: rgba(0, 0, 0, 0.1);}
.te-color-gray200 { color: rgba(0, 0, 0, 0.2);}
.te-bg-gray200 { background-color: rgba(0, 0, 0, 0.2);}
.te-color-gray300 { color: rgba(0, 0, 0, 0.3);}
……...
|
=========我是題外話的分割線===========
@for迴圈是很久以前某個好心的PG教的。當年大家都才剛出道，一片熱血，下了班互相研究對方的語法，工程師學一點CSS，設計師學一點小迴圈，這樣如果是小小的錯誤，還可互相cover一下。
真心不騙，這世界上要找到比我還笨的學生也不容易。學了好幾個禮拜，我唯一記得的也就剩這個。在此跟教過我的老師認真的說聲：對不起呀～
沒有留言:
張貼留言