如何将 css 中的部分元素设为全宽

Question

图中红圈处是我的问题：

这里是 Html/Css.

section {
  height: 100%;
  width: 100%;
  display: inline-block;
}

<section id="aboutSec">
  <div>
    <h1>Here is about Sec</h1>
  </div>
</section>

Answer 1

您要么在 section 元素上有一些 margin，要么在包含元素上有一些 padding。请记住，浏览器有一个默认样式表，所以如果您没有用 css reset 覆盖它，那么有些样式已经存在并影响您的布局。我建议将行 margin: 0; 添加到您的 section，然后遍历父元素或检查开发工具以查看父元素是否具有推动布局的填充。

Answer 2

section {
  height: 100%;
  width: 100%;
  display:inline-block;
  background:red;
}
*{
  padding:0px;
  margin:0px;
}

<section id="aboutSec">
  <div>
    <h1>Here is about Sec</h1>
  </div>
</section>

试一试

如何将 css 中的部分元素设为全宽

How to make section element in css to full width

html

css

width

web