如何删除段落和标题标记创建的自动间隙

时间:2015-12-17 18:36:02

标签: css

显然我必须将我的父元素overflow属性设置为隐藏,以防止浏览器在它与视图端口顶部之间创建间隙。但即便如此,差距只会转移到目标元素 我应该避免使用标题和段落而是使用spans和div吗?

body {
  background-color: #3A3C3D;
  margin: 0;
}

.backDrop {
  background-color: #aca;
  box-shadow: 0 0 20px black;
  height: 100vh;
  width: 90vw;
  margin: auto;
  position: abolute;
}
    <div class="backDrop">
      <h1>Hello world</h1>
    </div>

https://jsfiddle.net/4p3xotb8/2/

编辑:设置元素边距属性的样式解决了我的问题。我认为这会更复杂,因为我读到的关于保证金崩溃和一切的内容。我甚至向父元素添加了溢出属性。这些都不是必需的。简单地编辑目标标签的margin属性可以防止其干扰其他样式实现。谢谢!

1 个答案:

答案 0 :(得分:0)

只需删除边距并添加填充:

h1,p{
  margin:0;
  padding:10px;
}

JSFiddle