今天自己寫css樣式,其中用到了<ul>標簽,設置了一系列效果後運行,發現位置與設置有出入。chrome上打開檢查項,發現<ul>標簽的styles底部多了以下一段: ul, menu, dir { ul, menu, dir { display: block; list-style-type: d ...
今天自己寫css樣式,其中用到了<ul>標簽,設置了一系列效果後運行,發現位置與設置有出入。chrome上打開檢查項,發現<ul>標簽的styles底部多了以下一段:
ul, menu, dir {display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
} 旁邊顯示來源是:user agent stylesheet 檢查了html及css後,發現並無特別設置,html頭中也做了標準設定。百度了”user agent stylesheet“之後,發現是瀏覽器針對不同html元素,會有相應的css預設設置。 解決的方法: 1、比較簡單的一種方法:在css文件開頭設置通配符樣式,比如*{margin:0px;padding:0px;},覆蓋掉瀏覽器的預設設置; 2、複雜一點的方法:瞭解通用的幾種瀏覽器的預設設置,再單獨寫一個css文件,將需要修正的樣式都寫在裡面,以後做項目時可以共用。 以後有時間對此問題做詳細瞭解之後再做補充。