css遇到的那些坑－瀏覽器預設樣式設定

今天自己寫css樣式，其中用到了

標籤，設定了一系列效果後運行，發現位置與設定有出入。 chrome上打開檢查項，發現
標籤的styles底部多了以下一段：

ul, menu, dir {

display: block;

list-style-type: disc;

-webkit-web before: 1em;

-webkit-margin-after: 1em;

-webkit-margin-start: 0px;

-webkit-margin-end: 0px; } 

旁邊顯示來源是：user agent stylesheet

 

檢查了html及css後，發現並無特別設置，html頭中也做了標準設定。百度了」user agent stylesheet「之後，發現是瀏覽器針對不同html元素，會有對應的css預設設定。

解決的方法：

1、比較簡單的一種方法：在css檔案開頭設定通配符樣式，例如*{margin:0px;padding:0px;}，覆寫瀏覽器的預設設定；

2、複雜一點的方法：了解通用的幾種瀏覽器的預設設置，再單獨寫一個css文件，將需要修正的樣式都寫在裡面，以後做專案時可以共用。

 

以後有時間對此問題做詳細了解之後再做補充。

更多css遇到的那些坑－瀏覽器預設樣式設定 相關文章請關注PHP中文網！