大家好,我是烏木白,今天要介紹的是 Sass 裡的變數!
變數按照字面上來看,就是一個可以變動的數,那為什麼今天在寫 Sass 的時候需要了解變數呢?
以下範例:
.header {
color: red;
}
.content {
color: red;
}
.footer {
color: red;
}
這個在我們一般專案不大時,如果再使用顏色時都會這麼設置,但是今天這個專案完成後,或者是之後要做主色系的調整,你就必須要每個選擇器都要做更改,我們使用變數的話,那我們只需要更改最主要的地方即可。
變數示範:
$primary: black;
.header {
color: $primary;
}
.content {
color: $primary;
}
.footer {
color: $primary;
}
這時候在畫面上或者是編譯出來的內容就會是黑色喔!!