今天有個(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ī),雖然沒有用到一些高級(jí)技巧來兼容各瀏覽器之間的差異,但還算中規(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)作一段文字的容器,請(qǐng)不要使用它來參與布局。
安徽新華電腦學(xué)校專業(yè)職業(yè)規(guī)劃師為你提供更多幫助【在線咨詢】
DIV+CSS布局中p元素引起的問題
2009-12-23 15:37:46 作者:aultoale 來源:站長(zhǎng)網(wǎng)