CSS簡介:
層疊樣式表:Cascading?Style?Sheet?
所謂層疊,可以將整個網(wǎng)頁想象為多層疊合的結(jié)構(gòu),層次高的覆蓋層次低的.在Firefox上可用Tilt可視化.
CSS樣式表可編寫到元素的style屬性(標簽)當中如<p?style="color:red">?內(nèi)容</p>,這種樣式被稱為內(nèi)聯(lián)樣式,只對當前樣式起作用.(不推薦使用,html與CSS耦合在一起)
將CSS樣式寫入head的style標簽中,利用CSS選擇器選中元素,將樣式表編寫到style中,也可以是表現(xiàn)與結(jié)構(gòu)分離(推薦)例:
.......
<head>
? ? ? ? ? ? <style?type="text/css">
? ? ? ? ? ? p(<--指定元素){屬性;屬性}
? ? ? ? ? ? </style>
</head>
......
外部樣式表:
新建一個.css文件,將要表現(xiàn)的內(nèi)容和對象寫入其中.然后在對應(yīng)頁面中使用link標簽(自結(jié)束) 調(diào)用,將表現(xiàn)和結(jié)構(gòu)完全分離.
如:<link?rel="stylesheet"?type="text/css"? href="相對路徑/>
CSS語法:注釋同C語言 ,結(jié)構(gòu):選擇器?聲明塊
選擇器:通過選擇器可以選中頁面中的指定元素,并且將聲明塊中的樣式應(yīng)用到對應(yīng)元素
聲明塊:緊跟在選擇塊后面,使用一對{},是只是一組名值對結(jié)構(gòu),多個聲明用";"隔開
塊和內(nèi)聯(lián):
塊元素:獨占一行的元素,無論內(nèi)容有多少.p,和h1,<div>?標簽無任何語義,單純塊元素,不會有間隔默認設(shè)置.將網(wǎng)頁分區(qū).
內(nèi)聯(lián)元素:span是一個內(nèi)聯(lián)元素(行內(nèi)元素),指得是只占用自身大小的元素,不會占用一行常見的內(nèi)聯(lián)元素,空間不夠時會自動換行.
HTML5中用內(nèi)容模型將內(nèi)聯(lián)和塊解釋,所以并沒有真正的內(nèi)聯(lián)和塊.這只是一種簡便的理解方式.