例如:p {color: red}
則所有套用<p>標籤的內容皆會變成紅色。
此規則又可延伸如下:
- 在一個規則中可包含多重的declaration,例如:
p {color:red; font-size:12px; line-height:15px;} - 多個selectors也可以組合在一起,例如:
h1, h2, h3, h4, h5, h6 {color:blue; font-weight:bold;} - 多種規則也可以套用到同一個selectors上,例如:
h1, h2, h3, h4, h5, h6 {color:blue; font-weight:bold;}
h3 {font-style: italic;}
span與div的差異:div為區塊元素,會強迫換行,而span則為行內元素,不會強迫換行。
strong會產生粗體字,em則會產生斜體字。
透過Contextual Selectors,可以縮小樣式指定的範圍,例如:
div p {color: red;}
則只有在div之內的p標籤的內容會變成紅字
還可以像以下:
p span em{color: green;}
則只有在p段落中,span標籤中,在em標籤內的內容才會變成綠色。
最接近 {declaration}的標籤中的內容,才會受影響,其前面的tag只是用來指定其影響範圍而已。
Child Selectors
可用來指定一標籤規則必須是某一個標籤的children,用法如下:
p>em {color: green;}
但此規則目前IE不適用。
No comments:
Post a Comment