2013年9月12日 星期四

CSS筆記:一般原則

優化之道p.238 選擇器的種類
global selector: *
type selector: h1
class selector: p.note, .note (選擇class屬於note的p)
id selector: #nav
child selector: li>a (選擇身為li的小孩的a)
descendant selector: li a (選擇身為li的子孫的a)
adjacent sibling selector: h1+p (The selector matches if E1 and E2 share the same parent in the document tree and h1 immediately precedes p, ignoring non-element nodes (such as text nodes and comments). If this is the case, select that p.)
general sibling selector:h1~p (選取和h1有相同父元素的所有p)

NOTE:
    *[lang=fr] and [lang=fr] are equivalent.
    *.warning and .warning are equivalent.
    *#myid and #myid are equivalent.

關鍵想法: 把h1+p, h1~p等等想成跟regular expression一樣,背後有一個解譯器在運作,只要regular expression合乎語法,解譯器就能按照你的意思去運作。 (我自己是這樣想啦)



優化之道p.239 優先權
如果兩個選擇器相同的話,後者優先
如果一個選擇器較其他選擇器更具指定性,較具指定性規則會凌駕一般性的選擇器。 ex. p b > p, h1 > *
可以在任何屬性值後面加上!important,來表示此規則有最高優先權。




優化之道p.239 繼承
有些屬性會繼承給子孫元素
可以在屬性中用inherit來強迫繼承父元素的屬性值




CSS將每個HTML元素視為獨立的方框。這個方框若非「區塊」方框,就是「行內」方框(block and inline)

沒有留言:

張貼留言