Question

有人能告诉我为什么我能够设置标题类的样式而不是我的MainContent类吗？只显示Lorum Ipsum文本。 maincontent div不显示任何宽度，高度或颜色。谢谢你的帮助！

.header {
    width: 100%;
    height: 90px;
    background-color: blue;
}

.header img {
 height: 80%;
 margin-top: 10px;
 margin-left: 260px;
}

.MainContent {
    width: 100%;
    height: 80%;
    background-color: yellow;
}

<div class="header">
	<img src="img/epic_it.png" alt="epicit logo">
	<nav></nav>
</div>

<div class="MainContent">
	<h1>
	Lorem ipsum
	</h1>
</div>

Answer 1

在.header img声明的末尾有一个非常奇怪的标记，它被认为是CodeMirror invalid character，并导致其后的任何CSS中断。如果你编辑你的代码片段，你会在那里看到一个红色圆圈，虽然它在片段预览中是不可见的。

只需删除它即可修复问题：

.header {
  width: 100%;
  height: 90px;
  background-color: blue;
}

.header img {
  height: 80%;
  margin-top: 10px;
  margin-left: 260px;
}

.MainContent {
  width: 100%;
  height: 80%;
  background-color: yellow;
}

<div class="header">
  <img src="img/epic_it.png" alt="epicit logo">
</div>

<div class="MainContent">
  <h1>
    Lorem ipsum
  </h1>
</div>

希望这有帮助！：）

为什么我的CSS不适用于我的下一个div？

1 个答案: