我的 Css 背景颜色无法填满整个部分

Question

该网站应该是一个滚动的视差网站，有几个固定的背景图片。在这个特定的问题部分，我有两个 div 彼此相邻。最上面的有一个带有 h2 文本的固定背景图像。它应该用作包含我的信息文本的底部 div 的某种 header。出于某种原因，当我在信息文本 div 上设置背景颜色时，在固定图像 div 的底部和信息文本 div 的底部之间仍然有一个薄薄的白色 space div。

我知道像这样的东西可能是由边距塌陷引起的，所以我尝试了以下方法：

我尝试将边距设置为 0px（也为 1px），取出所有边距并使用填充代替，将所有填充设置为 0px 和 1px，更改图像大小，并更改图像高度。没有任何效果。

.aboutme {
  background: url('../img/aboutme11.png') no-repeat;
  font: 'Century Gothic';
  position: relative;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  min-height: 25%;
  position: absolute;
  color: #fff;
  font-size: 800%;
}

.aboutmetxt {
  font-size: 150%;
  overflow: auto;
  padding: 0px 80px;
  background-color: #323232;
  color: #f2f2f2;
}

<div id="paralax1" class="aboutme">
  <h2 style="font-size:100%; padding-top:50px;">About Me
    <h2>
</div>

<div id="aboutme" class="aboutmetxt">
  <p> I am a self taught Front end developer and Graphic Designer Currently Located in Los Angeles California. I am pursuing an opportunity to began a career in Web Development. This responsive website site was one of my first projects. I built using the
    skills I have learned from programing in JavaScript, HTML and CSS. I Currently attend California State University Northridge and am finishing my BA in Graphis Design with a minor in Computer Science.     </p>
</div>

Answer 1

我使用您的代码创建了一个 fiddle 并对其进行了一些编辑，希望对您有所帮助：

https://jsfiddle.net/1npm4g2j/18/

大部分时间我都让你的 html 独自一人：

HTML

<div id="paralax1" class="aboutme" >
 <h2>About Me<h2>
</div>

<div id="aboutme" class="aboutmetxt">
 <p> I am a self taught Front end developer and Graphic Designer Currently Located
  in Los Angeles California. I am pursuing an opportunity to began a career in
 Web Development. This responsive website site was one of my first projects.
 I built using the skills I have learned from programing in JavaScript, HTML and CSS.
 I Currently attend California State University Northridge and am finishing my
 BA in Graphis Design with a minor in Computer Science.</p>
</div>

你的 css 是我修改最多的地方：

CSS

html{
 background-color: #323232;
 height: 110vh;

overflow: scroll;
}

.aboutme{
  position: fixed;
  display: block;

 top: 5%;
 left: 15%;

 background:url('../img/aboutme11.png') no-repeat;
 font:'Century Gothic';

 background-position: center;
 background-size: cover;
 background-repeat: no-repeat;
 background-attachment: fixed;

 min-height: 25%;
 color:#fff;
}

.aboutmetxt{
 font-size: 150%;
 overflow: auto;
 padding: 0px 80px;
 background-color: #323232;
 color:#f2f2f2;
}

h2{
 font-size: 126px;

}

Answer 2

所以，您的代码中有很多很多错误，从关于我文本中的错误拼写到使用错误 CSS 属性。所以，我试图修复所有这些问题...

这是您的原始代码：https://jsfiddle.net/tvdchajo/1/

这是新代码（我知道大多数人只想要代码而不是解释。）

.aboutme {
  background: url('../img/aboutme11.png'), no-repeat;
  font-family: 'Century Gothic';
  position: relative;
  min-height: 25%;
  position: absolute;
  color: #fff;
  font-size: 800%;
}

.aboutmetxt {
  font-size: 150%;
  overflow: auto;
  padding: 0px 80px;
  color: #f2f2f2;
}

body {
  background-color: #323232;
}

<div id="paralax1" class="aboutme">
  <h2 style="font-size:100%; padding-top:50px;">
    About Me
  </h2>
</div>

<div id="aboutme" class="aboutmetxt">
  <p> I am a self taught Front-End Developer and Graphics Designer. I am currently located in Los Angeles, California. I am pursuing an opportunity to begin a career in Web Development. This responsive website site was one of my first projects. I built using the
    skills I have learned from programming in HTML, CSS and JavaScript. I'm currently attending 'California State University, Northridge' and I'm finishing my BA in Graphics &  Design with a minor in Computer Science. 
  </p>
</div>

所以基本上，我在这里所做的就是给 body { 您用于 .aboutmetxt { 的背景颜色。

这是我的网页版本的另一个 JSFiddle：https://jsfiddle.net/tvdchajo/2/

将 VW 和 VH 用于响应式网站。它们是两个非常有用的 CSS 单元。

我的 Css 背景颜色无法填满整个部分

My Css for Background Color Won't Fill Entire Section

css

background

background-color