首頁 > web前端 > css教學 > 學習WEB標準總結的一些CSS/XHTML知識小結第1/3頁_經驗交流

學習WEB標準總結的一些CSS/XHTML知識小結第1/3頁_經驗交流

PHP中文网
發布: 2016-05-16 12:04:47
原創
1847 人瀏覽過

1、很多相容性問題,是因為不同標籤在不同瀏覽器下有著不同的 padding margin預設值。所以可以事先定義

複製程式碼 程式碼如下:


* { padding:0; margin:0;}


複製代碼 程式碼如下:


ul,li,h1,h2,h3,h4,h5,h6,p,table,td,p ,img,hr,dd,dt,span,a,dt,dd,ol{margin:0;padding:0;font-size:12px;}



2、關於佈局,可以看dreamweaver cs3裡的模板怎麼寫的,它的寫法是最好的寫法。大的佈局,可以直接使用 dreamweaver cs3 裡預設的那些模板。然後去掉註釋,就能用了。

3、適當的使用margin/padding,在調整box(盒子)中,元素位置的時候,使用box(盒子)的padding比較好。而不要使用,box內元素的margin。

原因是,box內元素使用margin的時候,會對box的margin產生影響,產生錯位。

但在使用padding的時候注意一點: 例如本來 width:100px 的box,如果設定了padding-left:20px的話,那就要把width減去20px。

4、一個box,設定了border後,要把width減去border的粗。例如width:100px 的box,左右有1px的邊,那應該設定box width為98px。

5、加入box的時候,能不給width和height的,盡量不給。

height可以靠內部的元素去撐開。

width不設定的話,一般預設就是100%寬。

6.同時給一個box設定背景圖片和背景顏色的方法是,先設定背景圖片,再設定背景顏色,程式碼如下:

複製程式碼 程式碼如下:


.bg {background:url(/images/blbian.gif) no-repeat}
.style1 {width:100px;height:100px;background-color:#ebf1e5; }





7、當float:left之類的東西寫的太多,影響到周圍,或是下面的元素的時候,試著使用clear:both去清除。

複製程式碼 程式碼如下:




.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}



8、進行以下設定的時候


,會產生相容性問題。 ie6會出問題,你會發現,box不是3px高。
需要如下設定: font-size:1px; 才不會有問題。參考 dw cs3範本中 clearfloat中的寫法,還會加上line-height:0px。不過我發現不加也是可以的。但加會更正規。

9、在給單行文字設定height的時候,要同時設定line-height。不然會有相容性問題,文字會有小的錯位。

10、使用ul li列表的時候,一定要給ul設定 list-style-type: none; 不然會產生相容性問題。 ff下會出現原點,而ie下常常看不到。


相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板