Question

我开始学习CSS并且真的不知道如何处理这个问题。我正在尝试制作一个与本页底部黑色栏类似的纯色顶栏。但是，当我尝试这样做时，颜色类型会在文本周围形成一个框，而不是从页面的边框开始。我试着玩宽度/高度没有成功。

由于

编辑：

 body { margin:0;}
.
.
.
#bar{
      height: 100%; //these dont do anything
      width: 100%;
   background-color:black;}

<div id=bar>       <h1> <a href="index.html"> <span id=stuff>stuff </span></a>
       <br> <span id=stuff> stuff stuff stuff</span> </h1> 

       <ul>
<li><a href="#stuff">stuff stuff stuff</a></li>
<li><a href="#stuff">stuff stuff stuff</a></li>
<li><a href="#stuff">stuff stuff stuff</a></li>
<li><a href="#stuff">stuff stuff stuff</a></li>
<li><a href="#stuff">stuff stuff stuff</a></li>
<li><a href="#stuff">stuff stuff stuff</a></li>
</ul>

</div>

Answer 1

您是否在de background图片上尝试了100％的宽度和高度？

Answer 2

1）您应该在元素上设置width: 100%;并确保所有父元素也具有该元素。通过这种方式，元素被告知伸展到页面的整个宽度。 [你已经这样做了:)]

2）另外，确保元素是块元素或内联块元素（带display: inline-block），因此它不能作为普通的内联元素（它将与...一样大）它的内容需要）。

Answer 3

大多数浏览器设置默认边距，您可以在CSS中覆盖它们，包括body { margin:0; }。

更新：你在那里得到了h1，它也有自己的边距，所以也添加h1 {margin:0;}。

＆＃13;

body { margin: 0 }

#topBar { background: black; color: white; }

＆＃13;

<div id=topBar>Top bar</div>

＆＃13;

CSS：如何使元素的背景在整个页面上延伸？

3 个答案: