Question

我使用此数据创建了新的简单文档

HTML

<body>
<div class="header"></div>
</body>

CSS

.header {
    background-color:#000;
    width:100%;
    height:150px;   
}

它看起来像这样： image

图像中可以清楚地看到额外的空间

我想要一些像使用

这样的解决方案

* {
margin:0;
padding:0;
}

或使用

.header {
position:absolute;
    top:0px;
    right:0px;
    left:0px;
}

有没有其他方法可以删除这个额外的空间？

Answer 1

根据浏览器的不同，body会应用默认的填充或边距。要删除它，您只需执行以下操作：

body { padding: 0; margin: 0; }

Answer 2

只需添加此css代码

即可

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font-style: normal;
    vertical-align: baseline;
    outline:0;
}
h1,
h2,
h3,
h4,
h5{
    font-weight: normal;    
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
    display: block;
}

html中的额外空间

2 个答案: