使用CSS rest樣式標籤

2021-09-25 20:27:25 字數 844 閱讀 4599

每乙個html標籤都有它的預設樣式,例如標籤有上下邊距,body自帶外邊距等等。這些預設樣式在不同的瀏覽器中可能會不一樣,這就導致瀏覽器預設樣式會給我們帶來很大的麻煩,從而影響開發效率,所以最好的解決方案就是在一開始就將預設樣式都全部去掉或者覆蓋。通過重新定義標籤的樣式確保標籤在各個瀏覽器的表現特徵一致是我們樣式重置的根本原因。在此我總結了一些經常需要重置的標籤的預設樣式及重置情況。

常用標籤的預設樣式及重置

標籤預設樣式

重置預設樣式

body

上下左右四個方向具有外邊距

body

p段落標籤

上下具有一行外邊距

ph1~h6標題標籤

上下具有外邊距

h1,h2,h3,h4,h5,h6

ul無序列表

上下具有外邊距;

列表樣式預設小圓點;

左邊有內容填充

ulol有序列表

上下具有外邊距;

有序列表預設有數字;

左邊有內填充

oldl定義列表

dl上下有外邊距;

dd左邊有內填充

dldd

mark

背景預設是黃色背景;

字型預設是黑色

mark

strong強調標籤

預設字型是加粗

strong

em強調標籤

預設字型是傾斜

ema超連結標籤

預設有下劃線

aimg

容器有邊框時,底層預設有1px的空隙

img{/*容器有邊框時的樣式重置*/

vertical-align:top;

border:none;

a標籤樣式

以前用css一直沒有遇到過這個問題,在最近給乙個本科同學做的專案裡面。出現一些問題,搜尋引擎查了一些 和資料,發現很多人問到這個問題,給出的結果我試了試,大部分都不正確。給出我試的順序,可能會對大家有一些幫助 a link a visited a hover a active 今天看到一位匿名朋友的...

a標籤樣式

以前用css一直沒有遇到過這個問題,在最近給乙個本科同學做的專案裡面。出現一些問題,搜尋引擎查了一些 和資料,發現很多人問到這個問題,給出的結果我試了試,大部分都不正確。給出我試的順序,可能會對大家有一些幫助 a link a visited a hover a active 今天看到一位匿名朋友的...

a標籤樣式

一組專門的預定義的類稱為偽類,主要用來處理超連結的狀態。超連結文字的狀態可以通過偽類選擇符 樣式規則來控制。偽類選擇符包括 總 a 表示所有狀態下的連線 如 mycls a 一般a hover和a visited鏈結的狀態 顏色 下劃線等 應該是相同的。前三者分別對應body元素的link vlin...