寫給經常使用div+css的朋友的建議

1，ul方面的問題：默認的ul的margin和padding不是0，如果在導航中用到了左浮動的li，往往會把外部的div撐大，導致頁面變形，這就需要我們在寫代碼的時候不要忘記 ul{margin:0px; padding:0px;}

2,img方面的問題：這里牽涉的不同瀏覽器的問題，ie6是一直讓網頁設計師最頭疼的一個問題，關于圖片，這里有一個小小的問題，有時ie6里顯示的圖片height總是要大于準確值，這里就需要我們記住下面這一點 img{ display：block}

3，overflow方面問題：有時我們會看到，一些公司的注冊協議都是好長好長的，但又不能把頁面拉的太長，這就用到了overflow，我們可以把div的style里加上這個：overflow：auto

4，小窗口彈出的問題：當我們點擊某個按鈕，可能會看到一個小窗口彈出，而窗口其它的部分都變了灰色，這是怎么實現的呢，其實很簡單div+css就可以實現：
css部分：
.black_overlay
{
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: black;
z-index: 1001;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity=50);
}
.white_content
{
display: none;
position: absolute;
top:20%;
left: 30%;
width:outo;
background-color: white;
z-index: 1002;
overflow: auto;

}

.white_content2
{
display: none;
position: absolute;
top: 20%;
left: 18%;
width:896px;
background-color: white;
z-index: 1002;
overflow: auto;
text-align: center;
}
.qpshcom
{

background-color: #efefef;
color: #666666;
border-width: 1px;
border-color: #cccccc;
border-style: solid;
margin: 6px;
padding: 6px;
font-size: 14px;
line-height: 200%;
float: midden;
}
div部分：

打開按鈕部分：onclick="document.getElementById

('light').style.display='block';document.getElementById('fade').style.display='block'"
關閉按鈕部分：onclick="document.getElementById

('light').style.display='none';document.getElementById('fade').style.display='none'"

4，關于float的問題：有時候一些div會擠到頁面的上方，把頁面擠破掉，這里可能就是浮動引起的，這時候我們就用到了這個：clear：both，很不錯的解決方法，不妨一試。

5，height等于1px的div，在ie6中可能并不是1px，那怎么解決呢？不妨試一下：在這個div的style里加上font-size：1px;這樣就ok了。

6，下面再說一下id和class的問題：當一個div要在頁面中多次使用時，不要用id，要用class，還有就是要用引用js的時候，樣式好不要用id，因為id要留給js使用，當程序員寫后臺用的是.net時，好不用id，id要留給程序員用，前臺我們就用class好了。

7，還是img問題，頁面中好不要用大塊背景，能平鋪的要平鋪，否則加載起來會很慢，也不利于以后的優化和擴展，當然也有些大的網站，現在都盡量把背景統一放到一張圖片上，用background-postion來取得背景，這樣其實也好，背景雖然大了點，但只需統一加載一次，就ok了，速度也不會太慢，可以好好學習一下。

8，img的格式問題：好的格式就是gif格式，即確保了背景透明，在ie6中又不會有陰影，有時gif圖片會有鋸齒，這就需要我們保存成web格式，設置一下matter，matter的值用背景顏色的值越相近越好。（當然有時迫不得已png的圖片也會用到，這時就需要另外想辦法了，前面我也曾提到過，大家不妨一看）

9，鏈接問題：
.link：link{}
.link：visited{}
.link：hover{}
.link：active{}
有一點，visited與hover的順序一定不能倒換，否則ie6中會大大的問題。

10，css編碼問題：@charset "utf-8";注意這行代碼，utf-8與g把gb2312是比較常用的兩種編碼方式。

本文標題：寫給經常使用div+css的朋友的建議
當前URL：http://m.kartarina.com/news/195456.html

成都網站建設公司_創新互聯，為您提供企業建站、關鍵詞優化、服務器托管、響應式網站、品牌網站建設、電子商務

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯