Css Reset 復(fù)位相關(guān)資料整理

2024-07-11 08:26:34

字體：大中小

供稿：網(wǎng)友

PS：

*{
padding:0;
margin:0;
}

這就是最常用的Css Reset，但是這里會(huì)有很多問題。

原文前部分說了很多關(guān)于Css,以及各瀏覽器的css規(guī)則的不同,而制定"CssReset"也是為了兼容與統(tǒng)一,正確有效的使用"Css Reset"可以在某種程度上節(jié)約時(shí)間與金錢.

非常感謝Perishable的整理與歸納

下面是關(guān)于幾類Css Reset的簡(jiǎn)單介紹,本人能力有限.只能理解大概意思,還請(qǐng)各位看官見諒.

Minimalistic Reset [ Version 1 ]
相信這一段你經(jīng)常看到.而且也是我們經(jīng)常用到的

*{
padding:0;
margin:0;
}

Minimalistic Reset [ Version 2 ]
border:0的設(shè)計(jì)有些不靠譜了

*{
padding:0;
margin:0;
border:0;
}

Minimalistic Reset [ Version 3 ]
當(dāng)然這個(gè)也是不推薦的.會(huì)跟某些默認(rèn)樣式有沖突

復(fù)制代碼

代碼如下:
*{
outline:0;
padding:0;
margin:0;
border:0;
}

Condensed Universal Reset
這是作者當(dāng)前比較鐘意的一種寫法.保證了相對(duì)普遍瀏覽器樣式的統(tǒng)一性.

復(fù)制代碼

代碼如下:
*{
vertical-align:baselinebaseline;
font-weight:inherit;
font-family:inherit;
font-style:inherit;
font-size:100%;
border: 0none;
outline:0;
padding:0;
margin:0;
}

Poor Man’s Reset
其實(shí)這也是我們常用的一類Css Reset.對(duì)字體的大小復(fù)位,以及圖片鏈接的邊框處理.
也經(jīng)常在某些站點(diǎn)看到

復(fù)制代碼

代碼如下:
html, body{
padding:0;
margin:0;
}
html {
font-size:1em;
}
body {
font-size:100%;
}
a img, :link img, :visited img{
border:0;
}

Shaun Inman’s Global Reset
作者認(rèn)為Shaun寫這類的Css Reset是有某種目的性.
而且這類規(guī)則是針對(duì)的是某些重要的常用瀏覽器.
比如ie,firefox等

復(fù)制代碼

代碼如下:
body, div, dl, dt, dd, ul, ol, li, h1, h2,h3, h4, h5, h6,pre,
form, fieldset, input, p, blockquote, table, th, td, embed, object{
padding:0;
margin:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset, img, abbr{
border:0;
}
address, caption, cite, code, dfn,em,
h1, h2, h3, h4, h5, h6, strong, th, var{
font-weight:normal;
font-style:normal;
}
ul {
list-style:none;
}
caption, th{
text-align:left;
}
h1, h2, h3, h4, h5, h6{
font-size:1.0em;
}
q:before, q:after{
content:'';
}
a, ins{
text-decoration:none;
}

上一篇：div 內(nèi)table 居中實(shí)現(xiàn)代碼

下一篇：編寫跨瀏覽器兼容的 CSS 代碼

發(fā)表評(píng)論

共有條評(píng)論