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

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

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


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