带 CSS 的 HTML 不工作

Question

我遇到了一些奇怪的问题。我正在尝试创建一个黑框，它将作为视频和一些文本的背景，但是在我输入 CSS 后，黑框没有出现。不仅如此，我还尝试将 .videoBlock div 作为评论。在那里，我发现 .dwBlock div 之后的任何代码似乎都不适用于 CSS。例如，在我将 .videoBlock div 标记为注释后，页脚消失了。请任何帮助将不胜感激!多谢!!这是我的 HTML:

<div class="wrapOverall">
  <div class="header">
    <div class="navMain">
        <ul>
          <li><a href="#">Home</a></li>
          <li><a href="#">Contact</a></li>
          <li><a href="#">About</a></li>            
        </ul>
    </div><!--End of navMain-->
  </div><!--End of header-->
  <div class="wrapBlocks">
    <div class="psBlock"></div><!--End of psBlock-->
    <div class="dwBlock"></div><!--End of dwBlock-->
  </div><!--End of Overall block wrap-->
  <div id="videoblock"></div><!--End of videoBlock-->
  <div class="footer">
    <div class="social"></div><!--End of social-->
  </div><!--End of footer-->
</div><!--End of wrapOverall-->

这是我的 CSS:

.wrapOverall {
background:url(images/bg_main.png);
background-repeat:repeat-x;
width:1024px;
height:1024px;
}
.header {
height:176px;
background:url(images/bg_header.png);
background-repeat:repeat-x;
}
.navMain {
}
.wrapBlocks {
margin-top:28px;
}
.psBlock {
height: 235px;
width: 512px;
float:left;
background:url(images/bg_ps.png);
background-repeat:repeat-x;
}
.dwBlock {
height: 235px;
width: 512px;
float:right;
background:url(images/bg_dw.png);
background-repeat:repeat-x;
}
.videoblock {
width: 993px;
height: 348px;
background-color:#000;
}
.footer {
width: 1024px;
height:176px;
background:url(images/bg_header.png);
background-repeat:repeat-x; 
}

Answer 1

问题出在您的 CSS 中，而不是在您的 html 代码中，您使用的是 id="videoblock"但在您的 CSS 中，您被引用为类 .videoblock，更改 。通过 # 在你的 CSS 中像 #videoblock 一样工作正常。

#videoblock {
width: 993px;
height: 348px;
background-color:#000;
}

你能看演示吗here :