Home >Web Front-end >CSS Tutorial >CSS initialization code
CSS initialization code
- 巴扎黑Original
- 2017-04-05 11:26:561793browse
Why initialize CSS?
CSS initialization refers to resetting the browser's style. Different browsers may have different default styles, so the first thing when developing may be how to unify them. Page differences between browsers often occur if CSS is not initialized. Every time we develop a new website or webpage, we initialize the properties of the CSS style to make the CSS or html tags we will use more convenient and accurate, making it more convenient and concise when we develop webpage content, while reducing the amount of CSS code and saving webpage download time. .
CSS初始化示例代码
/* css reset www.admin10000.com */
body,p,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; }
body { background:#fff; color:#555; font-size:14px; font-family: Verdana, Arial, Helvetica, sans-serif; }
td,th,caption { font-size:14px; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; font-size:100%; }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal;}
a { color:#555; text-decoration:none; }
a:hover { text-decoration:underline; }
img { border:none; }
ol,ul,li { list-style:none; }
input, textarea, select, button { font:14px Verdana,Helvetica,Arial,sans-serif; }
table { border-collapse:collapse; }
html {overflow-y: scroll ;}
/* css common */
.clearfix:after {content: "."; display: block; height:0; clear:both; visibility: hidden;}
.clearfix { *zoom:1 ; }
The above is the CSS reset code used by admin10000.com. This code is a method I prefer to use. Although it is not perfect yet, almost all commonly used ones are included.
Default css styles under various mainstream browsers: ie6 | ie7 | ie8 | ie9 | Firefox 3.6.3 | Webkit (r57042) | Opera 10.51
By the way, the html template of admin10000.com is given below, is used for each new development page.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-cn"> <head> <title>网站标题 - Admin10000.com </title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="zh-CN" /> <meta name="Author" content="网页作者" /> <meta name="Copyright" content="网站版权" /> <meta name="keywords" content="网站关键字" /> <meta name="description" content="网站描述" /> <link rel="Shortcut Icon" href="网站.ico图标路径" /> <link type="text/css" rel="stylesheet" href="CSS文件路径" /> <script type="text/javascript" src="JS文件路径"></script> </head> <body> </body> </html>
The above is the detailed content of CSS initialization code. For more information, please follow other related articles on the PHP Chinese website!