總結(jié)寫DIV+CSS時(shí)常見的小問題_html/css_WEB-ITnose

　　默認(rèn)的ul的內(nèi)外補(bǔ)?。╩argin、padding）都不是0，如果在li中用到的左漂浮屬性（float:left;）時(shí)往往會(huì)把外部div撐大，導(dǎo)致頁(yè)面變形，而且在ie6里，第一個(gè)li會(huì)有一個(gè)小小的縮進(jìn)值，最終導(dǎo)致排版出問題。解決div層不被撐大時(shí)應(yīng)將層的內(nèi)外補(bǔ)丁設(shè)為0即可（margin:0;padding:0;），而解決第一個(gè)li有縮進(jìn)值時(shí)則應(yīng)該定義li為塊狀顯示（display:inline;）即可

2. img屬性的問題

　　這里牽涉的不同瀏覽器的問題，ie6是一直讓網(wǎng)頁(yè)設(shè)計(jì)師最頭疼的一個(gè)問題。頁(yè)面插入img時(shí)在ie6里有時(shí)圖片顯示的高度總是要大于準(zhǔn)確值，會(huì)多出下面的2px的誤差，解決方法是給img定義一個(gè)顯示屬性：img{float:left;}即可

3. overflow屬性的問題

　　此屬性用的最多的地方就是文本域、注冊(cè)協(xié)議等，因?yàn)槲淖制容^大，但又不想占用大的頁(yè)面篇幅，這里就可以定義好層的寬度和高度值，然后加上overflow:auto;屬性。

4. float屬性問題

　　有時(shí)會(huì)在水平方向上漂浮2個(gè)或2個(gè)以上的div層，都使用了float:left;屬性，最終導(dǎo)致下面的層會(huì)漂浮到該水平方向上來，導(dǎo)致頁(yè)面顯示非?；靵y，不注意的話在排錯(cuò)階段也很難找出問題所在。對(duì)待float屬性一定要謹(jǐn)慎，解決以上問題方法有二，第一是將這幾個(gè)漂浮的層的父級(jí)層定義clear:both;屬性；第二是將這幾個(gè)層的寬度值加起來的值等于父級(jí)元素的寬度值，這樣下面的層自然不會(huì)漂上來。

5. height值不統(tǒng)一

　　當(dāng)height為1px時(shí)，在ie6中可能并不是1px而是超過1px，怎么解決呢？方法有兩種，第一種是直接將該div層里的字號(hào)設(shè)為1px就可以了（font-size:1px;），第二種方法是在該div層里設(shè)置行高即可（line-height:1px;），但這里需要提醒下，在ie6里該層不能為空，可以寫一個(gè)空格字符（ ）即可。

6. css編碼問題

　　很多人寫頁(yè)面的時(shí)候習(xí)慣通過dw軟件來創(chuàng)建一個(gè)html頁(yè)面，但往往又忽略了其默認(rèn)編碼格式的設(shè)置，最終導(dǎo)致頁(yè)面顯示亂碼。@charset "utf-8"注意這行代碼，utf-8與gb2312是比較常用的兩種編碼方式，選擇與之匹配的編碼格式，避免出現(xiàn)亂碼。

7. 關(guān)于選擇器的選擇（class和id）問題

　　當(dāng)一個(gè)div要在頁(yè)面中多次使用時(shí)，不要用id，要用class，還有就是要用引用js的時(shí)候，樣式最好不要用id，因?yàn)閕d要留給js使用，當(dāng)程序員寫后臺(tái)用的是.net時(shí)，最好不要用id，id要留給程序員用，前臺(tái)我們就用class好了。

8. div層高度自動(dòng)擴(kuò)展問題

　　就是div層的結(jié)構(gòu)很復(fù)雜，用了至少2個(gè)以上的div層，在定義好最小高及高度為自動(dòng)，但最后超過層高度后導(dǎo)致在ff中顯示為高度不自動(dòng)擴(kuò)展，解決ff不兼容方法很簡(jiǎn)單，只要加上：overflow:hiiden;即可。

9. 常用的兼容屬性寫法問題

　　這里具體實(shí)例不列出了，估計(jì)長(zhǎng)篇大論的也沒問會(huì)看，我就把常用到的兼容性屬性列出來，具體靈活運(yùn)用就靠自己啦！建議定義屬性時(shí)書寫順序?yàn)镕ireFox在最前，其次是IE8、IE7，最后是IE6。

　?、?important屬性只對(duì)ff生效，如：width:200px!important;width:100px;則ff里寬度顯示為200px

　?、趲А癬”的屬性只對(duì)ie6生效，如：color:red;_color:blue;則ie6里字體顏色為blue

　?、蹘А?”的屬性只對(duì)ie7生效，寫法如上

　?、躥f什么都不識(shí)別，但樣式中加上上述小符號(hào)，則優(yōu)先對(duì)特定瀏覽器生效，例如css定義為：color:yellow;+color:blue;_color:red; 則輸出效果為ff顯示黃色，ie7顯示為藍(lán)色，ie6顯示為紅色

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com