今天有個(gè)網(wǎng)友問(wèn)我，他的一個(gè)頁(yè)面布局有點(diǎn)問(wèn)題，沒(méi)有按照CSS的定義來(lái)渲染，才子看了一下他的CSS文件，沒(méi)發(fā)現(xiàn)哪里有錯(cuò)誤，結(jié)果一看XHTML，發(fā)現(xiàn)一個(gè)才子以前犯過(guò)的一個(gè)錯(cuò)誤，在這里才子解釋一下，希望幫到一些新手！

這個(gè)網(wǎng)友，他的布局其實(shí)還算正規(guī)，雖然沒(méi)有用到一些高級(jí)技巧來(lái)兼容各瀏覽器之間的差異，但還算中規(guī)中矩，只有一個(gè)地方有問(wèn)題，那就是在主內(nèi)容模塊(#main)里，它用到了一個(gè)p元素(段落標(biāo)簽)來(lái)做子容器，其實(shí)這并沒(méi)有什么問(wèn)題，但p元素里面他又用到了好幾個(gè)塊元素(block element)，用到了h2和h3標(biāo)題標(biāo)簽，還有div元素，導(dǎo)致這個(gè)p元素在CSS中定義的內(nèi)邊距失效，他以為是塊元素浮動(dòng)(float)的問(wèn)題，結(jié)果用clear: both;清除浮動(dòng)還是沒(méi)用，p元素定義的padding: 10px;沒(méi)有生效。
才子告訴他原因了，p元素是個(gè)比較特殊的塊元素，它與我們常用來(lái)布局的div元素不同，p元素它只能裝內(nèi)聯(lián)元素(inline element)，而div元素可以裝任何元素，這估計(jì)也是為什么推薦采用div+css布局的原因之一吧。

以上的這個(gè)問(wèn)題才子在這里分享出來(lái)，希望新手們要注意了，采用div+css布局就盡量全部用div來(lái)排版，p標(biāo)簽只是一個(gè)段落標(biāo)簽，要用也只用來(lái)當(dāng)作一段文字的容器，請(qǐng)不要使用它來(lái)參與布局。


安徽新華電腦學(xué)校專業(yè)職業(yè)規(guī)劃師為你提供更多幫助【在線咨詢】