css簡介（一）

本文內容是對HTML & CSSDeSign anD buiLD WebSiTeS 第10章的小結。

一條CSS的規則由兩部分組成selector｛declaration｝，一個declaration是一個property：value；的組合。可以有多個selector有一樣的declaration，他們之間用逗號分開。

h1,h2,h3 {font-family:Arial; color:yellow;}

css寫好了，如何讓它顯示出效果呢？

有兩種，一種是external的一種是internal的，也就是一種是css放在單獨的檔案通過link來引入，另外一種是css的代碼直接嵌入在html中，

external： 必須放在head的節點下面才有用，這個也是可以理解的，畢竟要在body引入之前就要知道這些樣式，

<link href="css/styles.css" type="text/css" rel="stylesheet" />

internal：

    <style type="text/css">      body {          font-family: arial;          background-color: rgb(185,179,175);}      h1 {          color: rgb(255,255,255);}    </style>

selector可以有好多種：

a）全域的 *{}, 表示對當前頁面的所有的element都有效果。

b）element的name，比如h1, h2,h3 ｛｝

c）class， element的class，這裡要有點號，.note{}    或者  p.note{}, 這兩個的區別是，前面的是對所有的class是note的節點都有用，後面的只對name是p的節點下的class是note的有用。

d）id，element的id，這裡是以＃符號開始的，想起來和jquery很類似，＃introduction｛｝

e）還有一種是位置相關的selector，

child： li>a{}

descendant:
p a{}

adjacent sibing: 
h1+p{}

general sibing:
h1~p{}

這麼多selector如果有衝突，一般是更具體的代替更一般的全域的規則，另外還有一種辦法，就是  ！important

p b {color: blue !important;} 

property 同樣也有好多種，這個在下一篇裡介紹。