網(wǎng)頁規(guī)劃 CSS布局調試的有用辦法 |
發(fā)布時間:2020-05-11 文章來源:本站 瀏覽次數(shù):2750 |
網(wǎng)頁規(guī)劃中CSS布局是很重要的部分,下面介紹幾種查看調試CSS布局的有用辦法。 1. 查看HTML元素是否有拼寫過錯、是否忘掉完畢符號 即使是內行也經(jīng)常會弄錯div的嵌套關系。能夠用dreamweaver的驗證功能查看一下有無過錯。 2. 查看CSS是否書寫正確 查看一下有無拼寫過錯、是否忘掉結尾的 } 等。能夠使用CleanCSS來查看 CSS的拼寫過錯。CleanCSS本是為CSS瘦身的東西,但也能查看出拼寫過錯。 3. 用刪去法確定過錯發(fā)作的方位 如果過錯影響了全體布局,則能夠逐一刪去div塊,直到刪去某個div塊后顯現(xiàn)恢復正常,即可確定過錯發(fā)作的方位。 4. 使用border特點確定犯錯元素的布局特性 使用float特點布局一不小心就會犯錯。這時為元素增加border特點確定元素鴻溝,過錯原因即真相大白。 5. float元素的父元素不能指定clear特點 MacIE下如果對float的元素的父元素使用clear特點,周圍的float元素布局就會紊亂。這是MacIE的聞名的bug,假使不知道就會走彎路。 6. float元素務必指定width特點 很多瀏覽器在顯現(xiàn)未指定width的float元素時會有bug。所以不論float元素的內容如何,一定要為其指定width特點。 別的指定元素時盡量使用em而不是px做單位。 7. float元素不能指定margin和padding等特點 IE在顯現(xiàn)指定了margin和padding的float元素時有bug。因而不要對float元素指定margin和padding特點(能夠在float元素內部嵌套一個div來設置margin和padding)。也能夠使用hack辦法為IE指定特別的值。 8. float元素的寬度之和要小于100% 如果float元素的寬度之和正好是100%,某些古老的瀏覽器將不能正常顯現(xiàn)。因而請保證寬度之和小于99%。 9. 是否重設了默許的款式? 某些特點如margin、padding等,不同瀏覽器會有不同的解釋。因而最好在開發(fā)前首先將全體的margin、padding設置為0、列表款式設置為none等。 10. 是否忘掉了寫DTD? 如果無論怎樣調整不同瀏覽器顯現(xiàn)結果還是不一樣,那么能夠查看一下頁面最初是不是忘了寫下面這行DTD: http://www.w3.org/TR/html4/loose.dtd“》 |
|