如何删除正文周围的边距空间或清除默认的CSS样式

Ant*_*ony 30 html css margin css-reset

我当然是初学者,但在发布之前我也进行了大量的搜索.我的div元素周围似乎有额外的空间.我还想指出我尝试了很多边框组合:0,填充:0等等,似乎没有任何东西摆脱白色空间.

这是代码:

<html>
<head>
    <style type="text/css">
        #header_div  {
            background: #0A62AA;
            height: 64px;
            min-width: 500px;
        } 
        #vipcentral_logo { float:left;  margin: 0 0 0 0; }
        #intel_logo      { float:right; margin: 0 0 0 0; }
    </style>
</head>
<body>
    <div id="header_div">
        <img src="header_logo.png" id="vipcentral_logo">
        <img src="intel_logo.png" id="intel_logo"/>
    </div>
</body>
Run Code Online (Sandbox Code Playgroud)

这就是它的样子(我插入红色箭头以明确地调出额外的空间):

div元素周围的额外空间

我期待蓝色直接与浏览器边缘和工具栏相邻.这些图像都是64像素高,并且具有与分配给#header_div的图像相同的背景颜色.任何信息将不胜感激.

Rok*_*jan 52

body有默认边距:http://www.w3.org/TR/CSS2/sample.html

body { margin:0; } /* Remove body margins */
Run Code Online (Sandbox Code Playgroud)

或者你可以使用这个有用的全局重置

* { margin:0; padding:0; box-sizing:border-box; }
Run Code Online (Sandbox Code Playgroud)

如果你想要的东西不那么* 全球化:

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
Run Code Online (Sandbox Code Playgroud)

其他一些CSS重置:

http://yui.yahooapis.com/3.5.0/build/cssreset/cssreset-min.css
http://meyerweb.com/eric/tools/css/reset/
https://github.com/necolas/normalize .css/
http://html5doctor.com/html-5-reset-stylesheet/
...

  • 感谢大家的帮助!我首先尝试了这个作为“本垒打”解决方案,效果很好。问题解决了! (2认同)

Kev*_*sox 9

尝试从body标签中删除填充/边距.

body{
padding:0px;
margin:0px;
}
Run Code Online (Sandbox Code Playgroud)


Ale*_*lex 7

尝试在 CSS 中添加以下内容:

body, html{
    padding:0;
    margin:0;
}
Run Code Online (Sandbox Code Playgroud)


Guf*_*ffa 5

这是元素的默认边距/填充body

有些浏览器有默认边距,有些浏览器有默认内边距,两者都用作 body 元素中的内边距。

将其添加到您的 CSS 中:

body { margin: 0; padding: 0; }
Run Code Online (Sandbox Code Playgroud)