CSS繼承性之深入剖析(1)_CSS教程
教程Tag:暫無Tag,歡迎添加,賺取U幣!
CSS的繼續(xù)是指被包在內(nèi)部的標(biāo)簽將擁有外部標(biāo)簽的樣式性質(zhì)。繼續(xù)特性最典型的應(yīng)用通常發(fā)揮在整個網(wǎng)頁的樣式預(yù)設(shè),即整體布局聲明。而需要要指定為其它樣式的部份設(shè)定在個別元素里即可達(dá)到效果。這項(xiàng)特性可以給網(wǎng)頁設(shè)計(jì)者提供更理想的發(fā)揮空間。但同時(shí)繼續(xù)也有很多規(guī)則,應(yīng)用的時(shí)候輕易讓人迷惑。
CSS答應(yīng)我們?yōu)槲臋n設(shè)置更為豐富且便于修改的外觀。我們現(xiàn)在主要想和朋友們一起對CSS的繼續(xù)性進(jìn)行一點(diǎn)深入的探討。
CSS的一個主要特征就是繼續(xù),它是依靠于祖先—后代的關(guān)系的。繼續(xù)是一種機(jī)制,它答應(yīng)樣式不僅可以應(yīng)用于某個特定的元素,還可以應(yīng)用于它的后代。例如一個BODY定義了的顏色值也會應(yīng)用到段落的文本中。下面舉例說明:
示例代碼 [www.hl5o.cn]
樣式定義:body{color:blue;}
應(yīng)用舉例代碼:<p>CSS<strong>繼續(xù)性</strong>之深入剖析 - mb5u.com</p>
應(yīng)用舉例代碼:<p>CSS<strong>繼續(xù)性</strong>之深入剖析 - mb5u.com</p>
看下面的這個例子:
代碼調(diào)試框 [www.hl5o.cn]
[ 可先修改部分代碼 再運(yùn)行查看效果 ]
運(yùn)行上面的代碼,我們看到的結(jié)果是:“CSS繼續(xù)性之深入剖析”這段話是藍(lán)色�!袄^續(xù)性”由于應(yīng)用了strong元素,所以是粗體。這很符合作者的意圖,也是為什么CSS繼續(xù)了一部分的原因。
在實(shí)際工作中,我們編寫代碼,往往在CSS文檔的最前部,首先定義:
示例代碼 [www.hl5o.cn]
*{margin: 0; padding: 0; border: 0;}
這些代碼的真正用意在于,在缺省定義的情況下,所有無素的margin、padding、border的值都為零。當(dāng)需要應(yīng)用不同的樣式的時(shí)候,再單獨(dú)的對某元素進(jìn)行定義即可。也就是整個網(wǎng)頁的樣式預(yù)設(shè)、整體布局聲明。而需要指定為其它樣式的部份設(shè)定在個別元素里即可達(dá)到效果。
相關(guān)CSS教程:
- 相關(guān)鏈接:
- 教程說明:
CSS教程-CSS繼承性之深入剖析(1)
。