Question

在我制作第二部分标签之前，我有另一部分，它有这个代码。这里：

HTML

<div class="about-me-section">
<div class="about-me-overlay">
    <h1>Hi I'm Marielle,</h1>
    <p>A web developer and self-enthusiast</p>
</div>
</div>

CSS

.about-me-section {
background: url(https://images.unsplash.com/photo-1498622601663-8277ceda5cb6?auto=format&fit=crop&w=791&q=60&ixid=dW5zcGxhc2guY29tOzs7Ozs%3D);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  width: 100%;
  height: 100vh;
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.about-me-section::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: #0a1725;
    opacity: .94;
    z-index: 0;
}

.about-me-overlay {
    flex: 1;
    margin: auto;
    color: white;
    text-align: center;
    z-index: 6;
}

.about-me-overlay p {
  font-size: 1.5rem;
}

现在，我正在设计我的第二部分标签，当我添加填充，边距，高度或宽度时，它不会显示我在css中所做的更改。

HTML

<section id="background-technologies">
<div class="techno-wrapper">
<h1>Services <hr class="header-style-bottom-2"></h1>
</div>
</section>

CSS

  #background-techonologies section {
  max-width: 100%;
  margin: 0;
  padding: 0 2em;
}

#background-technologies h1 {
  text-align: center;
}

#background-technologies .techno-wrapper {
  margin: 0;
  width: 100%;
}

这是我的chrome dev工具中显示的屏幕截图 link here

Answer 1

你的css中有拼写错误。您在html中的部分ID是“＃background-technologies”，但在您的CSS中，它是“#background-techonologies”。

我的CSS没有影响我的第二个<section>标记

1 个答案: