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

本文介绍了如何删除正文周围的边距空间或清除默认 CSS 样式的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

诚然，我是初学者，但在发布此内容之前，我也进行了大量搜索.我的 div 元素周围似乎有额外的空间.我还想指出，我尝试了多种边框组合:0、填充:0 等，但似乎没有任何东西可以消除空白.

I am admittedly a beginner, but I also did a fair amount of searching before posting this. There seems to be extra space around my div element. I also would like to point out that I tried many combinations of border: 0, padding:0, etc. and nothing seemed to get rid of the white space.

代码如下:

<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>

这就是它的样子(我插入了红色箭头以明确指出多余的空间):

This is what it looks like (I inserted red arrows to explicitly call out the extra space):

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

I was expecting the blue color to abut directly to the browser edges and toolbar. The images are both exactly 64 pixels tall and have the same background color as the one assigned to #header_div. Any information would be greatly appreciated.

推荐答案

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

body {
    margin: 0;   /* Remove body margins */
}

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

Or you could use this useful Global reset

* {
    margin: 0;
    padding: 0;
    box-sizing:border-box;
}

如果你想要比 * global 更少的东西:

If you want something less * global than:

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;
}

其他一些 CSS 重置:

some other CSS Reset:

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/
…

这篇关于如何删除正文周围的边距空间或清除默认 CSS 样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！