css 重置樣式表

前言：
 關於css樣式重置 ，相信對於接觸過前端的人都知道在開始編寫屬於自己的代碼之前都需要完成這一步。不過，我還是想說說自己對css重置的理解。希望可以利人利己（哈哈，對，就素介麼任性！）
首先，我覺得像我一樣對於理解概念無感，容易混淆的前端小白要清楚什麼是css重置樣式，就要弄清楚兩個概念：CSS Reset以及css重置（其實概念很相近，但是還是有所區別的），不然傻傻只知道css樣式要重置，知其然不知其所以然，這對於我這種對概念有點強迫症的人來說，不搞清楚實在是太痛苦了。（哈哈哈，閑話少說，進入正題）
就我自己的理解而言，對於css重置樣式表可以分為下面3個問題：
（1）什麼是CSS Reset ？要用到CSS Reset的原因是？
（2）為什麼要重置CSS？
好啦，問題拋出了，我也該說說我自己的理解了：（1）CSS Reset簡單來講就是根據我們自己編寫頁面的需求重新設置css屬性（廢話，這個當然大家都知道！可是我重點想說的是css reset的原因耶~）css reset主要是因為html標簽在瀏覽器中都有各自的默認樣式，比如： p 標簽有上下邊距，strong標簽有字體加粗樣式，em標簽有字體傾斜樣式。不同瀏覽器的默認樣式之間也會有差別，例如ul默認帶有縮進的樣式，在IE 下，它的縮進是通過margin實現的，而Firefox下，它的縮進是由padding實現的。在切換頁面的時候，瀏覽器的默認樣式往往會給我們帶來麻 煩，影響開發效率。所以解決的方法就是一開始就將瀏覽器的默認樣式全部去掉，更准確說就是通過重新定義標簽樣式。“覆蓋”瀏覽器的CSS默認屬性。最最簡 單的說法就是把瀏覽器提供的默認樣式覆蓋掉！這就是CSS reset。
（2）涉及到為什麼要重置css，這點要從瀏覽器出發，因為不同的瀏覽器對於html標簽的解釋各不相同，重置css可以使得html標簽在各個瀏覽器下產生相同的表現效果。
我覺得這個時候有必要貼出css重置的樣式代碼，不然說了半天的廢話豈不是毫無用處？畢竟咬文嚼字不大適合我們嘛。

@charset "utf-8";
/*
 Document : CSS樣式初始化
 Created on : 2016. 8. 7,09:41:00
 Author :
 Description:
 CSS樣式表的初始化，全局樣式設置。部分樣式屬性請根據具體頁面重置其屬性
 導入方式：<link href="css/common.css" rel="stylesheet" type="text/css" /> */
/* reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,textarea,p,blockquote,th,td,input,select,textarea,button {margin:0;padding:0} /* 初始化標簽在所有瀏覽器中的margin、padding值 */
fieldset,img {border:0 none} /* 重置fieldset（表單分組）、圖片的邊框為0*/
dl,ul,ol,menu,li {list-style:none} /* 重置類表前導符號為onne,menu在HTML5中有效 */
blockquote, q {quotes: none} /* 重置嵌套引用的引號類型 */
blockquote:before, blockquote:after,q:before, q:after {content:'';content:none} /* 重置嵌套引用*/
input,select,textarea,button {vertical-align:middle} /* 重置表單控件垂直居中*/
button {border:0 none;background-color:transparent;cursor:pointer} /* 重置表單button按鈕效果 */
body {background:#fff} /* 重置body 頁面背景為白色 */
body,th,td,input,select,textarea,button {font-size:12px;line-height:1 ;font-family:"微軟雅黑", "黑體","宋體";color:#666} /* 重置頁面文字屬性 */
a {color:#666;text-decoration:none} /* 重置鏈接a標簽 */
a:active, a:hover {text-decoration:none} /* 重置鏈接a標簽的鼠標滑動效果 */
address,caption,cite,code,dfn,em,var {font-style:normal;font-weight:normal} /* 重置樣式標簽的樣式 */
caption {display:none;} /* 重置表格標題為隱藏 */
table {width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;} /* 重置table屬性 */
img{vertical-align:top} /* 圖片在當前行內的垂直位置 */




/* 頁面設置 */
 /* 取消a標簽點擊後的虛線框 */
a {outline: none;}
a:active {star:expression(this.onFocus=this.blur());}
 /* 設置頁面文字等在拖動鼠標選中情況下的背景色與文字顏色 */
/*
::selection {color: #fff;background-color: #4C6E78;}
::-moz-selection {color: #fff;background-color: #4C6E78;}
*/
/*清除浮動*/
.clear{clear: both;}
/*清除浮動推薦使用*/
.clearfix:before,.clearfix:after{content: '';display: table;}
.clearfix:after{clear: both;}