css中如何重置样式
小编给大家分享一下css中如何重置样式，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
1、css初始化标签在所有浏览器中的margin、padding值（内外边距）
body,h2,h3,h4,h5,h6,h7,hr,p,blockquote,/*structuralelements结构元素*/
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重置样式标签的样式**/
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;}/*统一等宽字体*/
small{font-size:12px;}/*小于12px的中文很难阅读，让small正常化*/
3、css重置列表元素样式
dl,ul,ol,menu,li{list-style:none}/*重置类表前导符号为onne,menu在HTML5中有效*/
4、css重置文本格式元素样式（鼠标效果）
/**重置链接a标签**/
a{color:#666;text-decoration:none}/*重置链接a标签样式*/
a:active,a:hover{text-decoration:none}/*重置链接a标签的鼠标滑动效果*/
/*取消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;}
*/
5、css重置表单元素样式
legend{color:#000;}/*forie6*/
fieldset,img{border:0none}/*重置fieldset（表单分组）、图片的边框为0*/
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}/*图片在当前行内的垂直位置*/
6、css重置表格元素样式
caption{display:none;}/*重置表格标题为隐藏*/
table{width:100%;border-collapse:collapse;border-spacing:0;table-layout:fixed;}/*重置table属性*/
7、清除浮动
/*清除浮动*/
.clear{clear:both;}
/*清除浮动--推荐使用*/
.clearfix:before,.clearfix:after{content:'';display:table;}
.clearfix:after{clear:both;}
8、css重置嵌套引用
blockquote,q{quotes:none}/*重置嵌套引用的引号类型*/
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}/*重置嵌套引用*/
以上是"css中如何重置样式"这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注行业资讯频道！
