css中如何重置樣式

小編給大家分享一下css中如何重置樣式，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)2013年開創(chuàng)至今，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務(wù)公司，擁有項(xiàng)目成都網(wǎng)站建設(shè)、成都網(wǎng)站制作網(wǎng)站策劃，項(xiàng)目實(shí)施與項(xiàng)目整合能力。我們以讓每一個(gè)夢(mèng)想脫穎而出為使命，1280元善左做網(wǎng)站,已為上家服務(wù),為善左各地企業(yè)和個(gè)人服務(wù),聯(lián)系電話:028-86922220

1、css初始化標(biāo)簽在所有瀏覽器中的margin、padding值（內(nèi)外邊距）

body,h2,h3,h4,h5,h6,h7,hr,p,blockquote,/*structuralelements結(jié)構(gòu)元素*/

dl,dt,dd,ul,ol,li,/*listelements列表元素*/

pre,/*textformattingelements文本格式元素*/

form,fieldset,legend,button,input,textarea,/*formelements表單元素*/

th,td/*tableelements表格元素*/{

margin:0;

padding:0;

}

2、css重置頁面元素樣式

body{background:#fff}/*重置body頁面背景為白色*/

body,th,td,input,select,textarea,button{/*重置頁面文字屬性*/

font-size:12px;line-height:1;font-family:"微軟雅黑","黑體","宋體";color:#666;

}

/**css重置樣式標(biāo)簽的樣式**/

h2{font-size:18px;/*18px/12px=1.5*/}

h3{font-size:16px;}

h4{font-size:14px;}

h5,h6,h7{font-size:100%;}

address,caption,cite,code,dfn,em,var{font-style:normal;font-weight:normal}/*將斜體扶正*/

code,kbd,pre,samp{font-family:couriernew,courier,monospace;}/*統(tǒng)一等寬字體*/

small{font-size:12px;}/*小于12px的中文很難閱讀，讓small正?；?/

3、css重置列表元素樣式

dl,ul,ol,menu,li{list-style:none}/*重置類表前導(dǎo)符號(hào)為onne,menu在HTML5中有效*/

4、css重置文本格式元素樣式（鼠標(biāo)效果）

/**重置鏈接a標(biāo)簽**/

a{color:#666;text-decoration:none}/*重置鏈接a標(biāo)簽樣式*/

a:active,a:hover{text-decoration:none}/*重置鏈接a標(biāo)簽的鼠標(biāo)滑動(dòng)效果*/

/*取消a標(biāo)簽點(diǎn)擊后的虛線框*/

a{outline:none;}

a:active{star:expression(this.onFocus=this.blur());}

/**設(shè)置頁面文字等在拖動(dòng)鼠標(biāo)選中情況下的背景色與文字顏色**/

::selection{color:#fff;background-color:#4C6E78;}

::-moz-selection{color:#fff;background-color:#4C6E78;}

5、css重置表單元素樣式

legend{color:#000;}/*forie6*/

fieldset,img{border:0none}/*重置fieldset（表單分組）、圖片的邊框?yàn)?*/

button,input,select,textarea{

font-size:100%;/*使得表單元素在ie下能繼承字體大小，*/

vertical-align:middle;/*重置表單控件垂直居中*/

}

/*注：optgroup無法扶正*/

/*重置表單button按鈕效果*/

button{border:0none;background-color:transparent;cursor:pointer}

img{vertical-align:top}/*圖片在當(dāng)前行內(nèi)的垂直位置*/

6、css重置表格元素樣式

caption{display:none;}/*重置表格標(biāo)題為隱藏*/

table{width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;}/*重置table屬性*/

7、清除浮動(dòng)

/*清除浮動(dòng)*/

.clear{clear:both;}

/*清除浮動(dòng)--推薦使用*/

.clearfix:before,.clearfix:after{content:'';display:table;}

.clearfix:after{clear:both;}

8、css重置嵌套引用

blockquote,q{quotes:none}/*重置嵌套引用的引號(hào)類型*/

blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}/*重置嵌套引用*/

以上是“css中如何重置樣式”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享標(biāo)題：css中如何重置樣式
文章URL：http://bm7419.com/article6/goisig.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供關(guān)鍵詞優(yōu)化、營(yíng)銷型網(wǎng)站建設(shè)、網(wǎng)站收錄、云服務(wù)器、App開發(fā)、網(wǎng)站建設(shè)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容