Upgrade to Pro — share decks privately, control downloads, hide ads and more …

CSS Cascading&Inheritance

CSS Cascading&Inheritance

Ryan Chung

March 28, 2014
Tweet

More Decks by Ryan Chung

Other Decks in Technology

Transcript

  1. http://MobileDev.TW CSS規則套用的優先權 Specificity •  直接寫在HTML元件的style屬性 •  優先權值:1000 •  CSS選擇器使用ID的方式 • 

    優先權值:100 •  CSS選擇器使用class,pseudo-class或限定屬性 •  優先權值:10 •  CSS選擇器使用HTML元件、偽元件(pseudo-element) •  優先權值:1 CSS Cascading & Inheritence 10
  2. http://MobileDev.TW 計算 Specificity •  #container ul#menu li.active ul li:hover {}

    •  #container:100 •  ul:1 •  #menu:100 •  li:1 •  .active:10 •  ul:1 •  li:1 •  :hover:10 CSS Cascading & Inheritence 11 Specificity:224