在接觸 CSS 之後,馬上得面對一個問題:
「CSS 要怎麼套用?」
因為它跟 HTML 的語法顯然有很大的差別......
所以認識 Selector(選擇器) 真的是關鍵的一步。
顧名思義,它的工作就是先選定我要修改的 HTML 內容!
h1 {
color: red;
}
這樣 CSS 就會找到網頁裡的 <h1>,把它的文字變成紅色。
如果寫成:
p {
color: blue;
}
那網頁裡的 <p> 也會套用這個設定。
前面的 h1 是我要選擇的對象,而大括號裡面的 color: red; 則是在告訴它:
「你被選中了,接下來請你套用這個樣式。」
CSS 的基本結構:
選擇器 {
屬性: 值;
}
所以 CSS 是要先找到「誰」要變,再告訴它「要改成什麼樣子」。
不過好像有一個問題耶......
如果我的網頁裡有很多 <p>,但我只想讓其中一段變成紅色呢?
看來 CSS 還有更多學問!
Day 14,認識 CSS Selector。
先學會最基本的:
「先找到對象,再替它設定樣式。」