CSS初始化的代码怎么写

html-css010

CSS初始化的代码怎么写,第1张

最耗资源的,最简单的

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

选择性初始化举例(综合)

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,legend,button

form,fieldset,input,textarea,p,blockquote,th,td {

padding: 0

margin: 0

}

3. 参考新浪、雅虎

/* 新浪全局样式 */

body,ul,ol,li,p,h1,h2,h3,h4,h5,h6,form,fieldset,table,td,img,div{

  margin:0padding:0border:0

}

body{

  background:#fffcolor:#333font-size:12pxmargin-top:5pxfont-family:"SimSun","宋体","Arial Narrow"

}

ul,ol{

  list-style-type:none

}

select,input,img,select{

  vertical-align:middle

}

a{text-decoration:none}

a:link{color:#009}

a:visited{color:#800080}

a:hover,a:active,a:focus{color:#c00text-decoration:underline}

/* 雅虎全局样式 */

html {

  background: none repeat scroll 0 0 #FFFFFF

  color: #000000

}

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {

  margin: 0

  padding: 0

}

table {

  border-collapse: collapse

  border-spacing: 0

}

fieldset, img {

  border: 0 none

}

address, caption, cite, code, dfn, em, strong, th, var {

  font-style: normal

  font-weight: normal

}

li {

  list-style: none outside 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 none

  font-variant: normal

}

sup {

  vertical-align: text-top

}

sub {

  vertical-align: text-bottom

}

input, textarea, select {

  font-family: inherit

  font-size: inherit

  font-weight: inherit

}

input, textarea, select {

}

legend {

  color: #000000

}

body {

  font: 13px/1.231 arial,helvetica,clean,sans-serif

}

select, input, button, textarea {

  font: 99% arial,helvetica,clean,sans-serif

}

table {

  font-size: inherit

}

pre, code, kbd, samp, tt {

  font-family: monospace

  line-height: 100%

}

a {

  text-decoration: none

}

a:hover, a:focus {

  text-decoration: underline

}

strong {

  font-weight: bold

}

input[type="submit"] {

  cursor: pointer

}

button {

  cursor: pointer

}

(文章来源于:玉溪无痛人流因为各种浏览器的算法不一样,从而导致CSS在不同的浏览器中存在一部分不一样的效果,CSS重置就是写一段初始化CSS将这些浏览器不同的初始化设置指定同一种显示效果。使用了CSS重置以后,各不同浏览器的初始化设置将一致,后面再写CSS的时候就不会因为浏览器的初始化不同从而导致显示的效果不一致了。CSS重置使用的误区下面这段代码是网上很多网站CSS开始之前使用的CSS重置代码,看着就让人头晕,可能连网站设计者自己都搞不懂里面很多标签的含义。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, 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, article,aside, canvas, details, embed, figure, figcaption, footer, header,hgroup, menu, nav, output, ruby,section,summary,time, mark, audio, video {margin: 0padding: 0border: 0font-size: 100%font: inheritvertical-align: baseline}我们写CSS重置要考虑到自己的网站的具体设计,如上面那段CSS代码所示,你的网站可能只有用到里面的其中一小部分标签,但是你却把所有的全部复制到你的CSS里面,你考虑过CSS渲染的问题吗?对你没用的东西你为什么要写进去呢?写程序是一件很严谨的事情,你写的每一段代码你至少需要知道其含义是什么,原样复制连自己都弄不清楚是什么意思有想到会造成什么后果吗?