首頁  >  文章  >  web前端  >  CSS初始化程式碼

CSS初始化程式碼

巴扎黑
巴扎黑原創
2017-04-05 11:26:561749瀏覽

為什麼要初始化CSS?

CSS初始化是指重設瀏覽器的樣式。不同的瀏覽器預設的樣式可能不盡相同,所以開發時的第一件事可能就是如何把它們統一。如果沒有對CSS初始化往往會出現瀏覽器之間的頁面差異。每次新開發網站或新網頁時候透過初始化CSS樣式的屬性,為我們將用到的CSS或html標籤更加方便準確,使得我們開發網頁內容時更加方便簡潔,同時減少CSS代碼量,節約網頁下載時間。

CSS 初始化範例程式碼

/* CSS 重設www.admin10000.com */
body,p,dl,dt,dd,ul,ol, li ,h1,h2,h3,h4,h5,h6,前,代碼,表單,字段集,圖例,輸入,按鈕,文字區域,p,區塊引用,th,td { 邊距:0;# 填入:0 ;##}##主題
{背景## fff; 顏色:#555;# 字型大小:14px; 字型系列: Verdana、Arial、Helvetica、sans-serif; }#td,th,標題
{字體大小:14px; }#h1、h2、h3、h4 、h5 , h6
{ 字體粗細:##正常##; 字型大小:100%; #}#位址、標題、引用、程式碼、 dfn、em、strong、th、var {
字型樣式:正常; 字型粗細:正常;#}#a {
## 顏色:#555; 文字裝飾##:none; }#a:hover { 文字裝飾
:下劃線; #}#img { 邊框
:; #}ol ,ul,li { 列表樣式
:#無; #}##輸入、文字區域、選擇、按鈕{
#14px Verdana、Helvetica、 Arial、無襯線字體; }#table { border-collapse:collapse##;##}html
{overflow-y: scroll ;} /*
css common */ .clearfix:after
{content: "."##; display: block; height:0; clear:both;# visibility: hidden#;}.clearfix
{ *zoom##:##1 ; } 上面是admin10000.com使用的CSS重置程式碼,這段程式碼是我比較喜歡用的一種方式,雖然還不夠完美但是常用的幾乎已經都包含了。 各主流瀏覽器下的預設css樣式

:ie6  |  ie7  |  ie8  |  ie9  | Firefox 3.6.3  |  Webkit (r57042)  |  Opera 10.51 |  Webkit (r57042)  |  Opera 10.51 |  Webkit (r57042)  |  Opera 10.51 |  Webkit (r57042)  |  Opera 10.51 |  Webkit (r57042)  |  Opera 10.51 |  Webkit (r57042一樣) 一樣 |  Opera 10.51 |  Webkit (r57042)  |  Opera 10.51 |  #  

# 下面順便給出admin10000.com 的html模板,

用於每次新開發頁面使用。

<!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>
               

以上是CSS初始化程式碼的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn