其實以前就會一些皮毛,但這次要了解更深入點....
基本上 CSS 是架構於 HTML 與 XHTML 上的
理論上架構於這兩者之上的語法都可以運用才是
項目 | 語法 | 範例 | 備註 |
基礎語法 | tag名稱 {動作:參數;...} | h1{text-align:center;color:red} | |
物件語法 | tag名稱 . 自訂名稱{動作:參數;...} | h1.tryit{text-align:center;color:red} .tryit{text-align:center;color:red} | *自訂名稱開頭不能為數字,否則 Mozilla / Firfox 會無法判別。 *tag名稱可以省略,這樣即表示所有 tag 符合自訂名稱者皆會套用。 *當有兩個以上自訂名稱要加入同一個 tag 的 class 參數內時,請以空格隔開即可。 |
指定元件參數 | tag名稱[tag參數="值"]{動作:參數;...} | input[type="input"]{background-color:blue} | *當 tag 內的參數值符合設定時,CSS 就會啟動套用。 |
ID | tag名稱 # ID名稱{動作:參數;...} | h1#myh1{text-align:center;color:red} #myh1{text-align:center;color:red} | *ID名稱開頭不能為數字,否則 Mozilla / Firfox 會無法判別。 *tag名稱可以省略,這樣即表示所有 tag 符合 ID 名稱者皆會套用。 |
參閱:W3C School CSS
沒有留言:
張貼留言