html - 边距未设置为零

标签 html css

我将 article 标签和 header 标签之间的边距设置为 0,但我仍然看到它们之间有一个空格,显示我的正文为黄色。我正在尝试将标题和文章之间的空间最小化为 0,而不将正文中的所有元素都设置为 marin: 0

这是我的 CSS。

body 
{
background-color: yellow;
margin: 0;
}

header > * {
margin: 0;
float: left;
}

header
{
background-color: white ;
width: 100%;
height: 40px;

}

article > * {
margin: 0;
}

article
{
background-color: red;
}

#search {
background-color: #a6dbed;
height: 500px;
}

#mostdesired 
{
background-color: #c7d1d6;
height: 200px;
}

这是html

<body>
    <header>
        <h1>Welcome</h1>
        <input type="text"/>
        <input type="submit" value="Search"/>
    </header>
    <article>
        <section id="search"><h2>this is the search</h2>@RenderBody()</section>
        <section id="mostdesired" ><h2>This is the most section</h2></section>
    </article>
</body>

最佳答案

您需要从 <h2> 中删除默认边距元素:

section h2 {
    margin:0;
}

jsFiddle example

关于html - 边距未设置为零,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24021194/

相关文章:

html - 显示: inline-flex; AND flex-wrap:wrap; doesn’t fill previous line of text

html - link_to_unless_current 将类分配给禁用的(当前)链接

jquery - 选择 &lt;header&gt; 的外部元素并仅切换一个元素

html - 手机输入小

html - 移动每个其他对象的内联图片的边距

html - 如何垂直对齐 h2 标签中的 div?

javascript - 将一个元素悬停在另一个元素上

html - 在焦点输入上更改标签的文本颜色

CSS Cascading规则W3C解释请

html - Bootstrap btn 类,但不是悬停状态