【css】通配符選擇器&清除瀏覽器默認樣式

一、通配符選擇器

寫法:*{}
星號即為通配符選擇器,寫在其中的樣式會應用頁面到所有的元素中,所以使用的頻率并不高,主要用于清除瀏覽器默認樣式。

二、清除瀏覽器默認樣式

在使用各種元素的過程中,我們會發(fā)現(xiàn)很多元素都是有默認樣式的,比如<body>標簽有默認的padding值和margin值,<h1>和<p>標簽有默認的行高字號,margin值,a標簽有默認的下劃線,列表前面有小圓點等等,常常會干擾我們進行頁面的編寫,所以我們可以事先使用通配符選擇器進行瀏覽器默認樣式清除。

*{
  margin:0;
  padding:0;
  list-style:none;
}

更精準的清除方法
剛剛我們使用的通配符選擇器,會給所有元素都設置一遍默認樣式,解析的工作量會比較大,所以我們可以根據(jù)我的頁面里到底有哪些元素需要清除,使用群組選擇器寫出更精確的清除默認樣式css,如:

body,h1,h2,h3,h4,h5,h6,p,dl,dd{
    margin: 0;
    font:12px '微軟雅黑';
    color: #333;
}
ol,ul{
    margin: 0;
    padding: 0;
    list-style: none;
}
a{
    text-decoration: none;
}
input{
    border:none;
    outline:none;
}

可以把它寫入一個外部樣式表reset.css,如果需要清除直接導入就可以啦。

<link rel="stylesheet" href="css/reset.css" type="text/css">

三、清除瀏覽器默認樣式的好處

1、清除在編寫頁面中由于瀏覽器默認樣式帶來的干擾。
2、兼容性更好,不同瀏覽器的默認樣式可能會有所不同,如果不清楚可能會造成我們編寫的頁面在不同瀏覽器上的效果有所出入。

選擇器部分文章:
選擇器介紹(一)標簽選擇器、id選擇器、類選擇器
http://www.itdecent.cn/p/d2f54bc64302
選擇器介紹(二)后代選擇器,子代選擇器,交集選擇器,并集(群組)選擇器
http://www.itdecent.cn/p/98f6788d0f54
通配符選擇器&清除瀏覽器默認樣式
http://www.itdecent.cn/p/4eb179b4fdfc

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

友情鏈接更多精彩內容