iT邦幫忙

18

Reset CSS,讓css更相容於各牌瀏覽器的方法

  • 分享至 

  • xImage
  •  

由於各家瀏覽器實作方式不同,為了降低彼此間的差異,而有重設css(reset CSS)的方法,將一些設定都歸成一樣,之後再重設。

雖然沒辦法解決所有的問題,不過至少可以降低使用一些hack的機會。
版本一
來源:http://meyerweb.com/eric/tools/css/reset/
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}

版本二
來源:http://developer.yahoo.com/yui/reset/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin:0;
padding:0;
}
table {
border-collapse:collapse;
border-spacing:0;
}
fieldset,img {
border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
font-style:normal;
font-weight:normal;
}
ol,ul {
list-style:none;
}
caption,th {
text-align:left;
}
h1,h2,h3,h4,h5,h6 {
font-size:100%;
font-weight:normal;
}
q:before,q:after {
content:'';
}
abbr,acronym { border:0;
}


圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中
0
5min
iT邦好手 3 級 ‧ 2008-04-21 00:27:02

謝謝分享

0
john651216
iT邦研究生 1 級 ‧ 2008-04-23 17:26:35

謝謝分享

0
tgunlu
iT邦研究生 1 級 ‧ 2008-04-25 06:55:02

謝謝分享

0
fanylu60
iT邦研究生 1 級 ‧ 2008-04-25 10:21:40

感謝提供分享

0
yce701116
iT邦研究生 1 級 ‧ 2008-04-25 17:38:27

感謝分享資訊

0
海綿寶寶
iT邦大神 1 級 ‧ 2008-04-25 21:23:34

所以 RESET 是由瀏覽器執行的囉

0
tyc1220
iT邦研究生 1 級 ‧ 2008-05-18 00:14:23

謝謝分享

0

有幫助但不甚了解...,還是謝謝分享咯!

0
alexc
iT邦高手 1 級 ‧ 2009-06-10 09:47:01

看來似乎是先重新還原到最初值

0
tacohero
iT邦新手 5 級 ‧ 2013-08-07 14:48:19

那這樣reset.css 跟 style.css 有順序上的差異嗎@@style不是會被reset影響@@所以是在互相牽制的情況下達到想要的排版@@不大了解

我要留言

立即登入留言