我的CSS有一个问题,如果我使用margin:0而不是margin-top:0,则对于标头p,标头{margin:0 0 20px; }会和那里一样好.应该是那样吗?如果我看到萤火虫中发生了什么,那是因为标头的边距底部折叠到了下一个同级部分中.
html
<header>
<h1>Todo List</h1>
<p>HTML5 Offline Capable Web Application</p>
</header>
的CSS
header { font: 24px/1em Notethis; color: #666; margin: 0 0 20px; }
header h1 { font: 60px/1.4em Hetilica; margin: 0; }
header p { margin-top: 0; }
最佳答案
我认为这里的问题是您的header元素实际上根本没有渲染应用于其的任何边距.您看到的空间实际上是应用于页眉p的默认边距的结果.
我说这的原因是,除非明确定义,否则许多浏览器不会将header标记自动视为块级元素:
header { display: block; }
在您的CSS标头中应用此语句之后,我可以成功地应用标头p {margin:0}并保留标头本身中指定的空白.删除此语句将还原为您看到的行为.
原文地址:https://www.jb51.cc/css/530778.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。