css去掉浏览器默认样式
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了css去掉浏览器默认样式相关的知识，希望对你有一定的参考价值。
问题如图，出现与浏览器边缘的空白距离 怎样去掉 ？
html：<body><div class="top"></div></body>
css:.top
height:60px;
background-image:url(../image/daohang1-bg.jpg) ;
background-repeat:repeat-x;
/** 清除内外边距 **/
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, /* structural elements 结构元素 */
dl, dt, dd, ul, ol, li, /* list elements 列表元素 */
pre, /* text formatting elements 文本格式元素 */
form, fieldset, legend, button, input, textarea, /* form elements 表单元素 */
th, td /* table elements 表格元素 */
margin: 0;
padding: 0;
/** 设置默认字体 **/
body,
button, input, select, textarea /* for ie */
font: 14px/1.5 tahoma, \\5b8b\\4f53, sans-serif;
h1, h2, h3, h4, h5, h6 font-size: 100%; font-weight: normal;
address, cite, dfn, em, var font-style: normal; /* 将斜体扶正 */
code, kbd, pre, samp font-family: courier new, courier, monospace; /* 统一等宽字体 */
small font-size: 12px; /* 小于 12px 的中文很难阅读, 让 small 正常化 */
/** 重置列表元素 **/
ul, ol list-style: none;
/** 重置文本格式元素 **/
a text-decoration: none;
a:hover text-decoration: underline;
sup vertical-align: text-top; /* 重置, 减少对行高的影响 */
sub vertical-align: text-bottom;
/** 重置表单元素 **/
legend color: #000; /* for ie6 */
fieldset, img border: 0; /* img 搭车：让链接里的 img 无边框 */
button, input, select, textarea font-size: 100%; /* 使得表单元素在 ie 下能继承字体大小 */
/* 注：optgroup 无法扶正 */
/** 重置表格元素 **/
table border-collapse: collapse; border-spacing: 0;
/* 重置 HTML5 元素 */
article, aside, details, figcaption, figure, footer,header, hgroup, menu, nav, section,
summary, time, mark, audio, video
display: block;
margin: 0;
padding: 0;
mark background: #ff0;
理念：
1. reset 的目的不是清除浏览器的默认样式, 这仅是部分工作. 清除和重置是紧密不可分的.
2. reset 的目的不是让默认样式在所有浏览器下一致, 而是减少默认样式有可能带来的问题.
3. reset 期望提供一套普适通用的基础样式. 但没有银弹, 推荐根据具体需求, 裁剪和修改后再使用.
因为各个浏览器默认的样式不同，你这种情况可以使用下面代码清除边距
<style>*margin:0;padding:0;</style>建议做网站的时候，设置个reset.css样式表清除各个浏览器的默认样式，已达到做的网页在各个浏览器中达到统一，下面把YUI Reset CSS代码贴出
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,tdmargin:0;
padding:0;
table
border-collapse:collapse;
border-spacing:0;
fieldset,img
border:0;
address,caption,cite,code,dfn,em,strong,th,var
font-style:normal;
font-weight:normal;
ol,ul
list-style:none;
caption,th
text-align:left;
h1,h2,h3,h4,h5,h6
font-size:100%;
font-weight:normal;
q:before,q:after
content:'';
abbr,acronym border:0;
参考技术B FF中默认是有padding值的,而在IE中只有margin默认有值。修改其值，默认值就没有了。楼上正解：<style>
*margin:0;padding:0;
</style> 参考技术C 您这是默认的边距样式，很多标签都有默认样式
列如：边距、填充、行高、字号、颜色、等等...
一般都是在样式表里首先写出清空所有标签样式
方法一：*padding:0px；margin:0px; (备：“*”代表所有标签)
方法二：body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,tdmargin:0;padding:0
很多大网站都不采取第一种方法，推荐第二种 参考技术D <style>
*margin:0;padding:0;
</style>
以上是关于css去掉浏览器默认样式的主要内容，如果未能解决你的问题，请参考以下文章