我整晚都在阅读论坛,但仍然无法弄清楚这一点。
我想让我的 div 之一作为我网站中其他所有内容的背景。我还希望它从一个特定的位置开始,即它不会占据整个页面。
这个 div(the_background 类)是我的容器 div 的子级,它是 body 的子级,如下所示:
头标签(通常的东西在这里)关闭头标签
<body>
<div class="container">
<div class="header">
<img src="images/open-access/header.png">
</div>
<br/>
<div class="signout">
login name | <a href="#">signout</a>
</div>
<br/>
<div class="menu">
<ul>
<li><a href="#">Bunch of links etc.</a></li>
</ul>
<div class="under_menu">
</div>
</div>
<div class="welcome">
Welcome, name!
</div>
<div class="the_background"></div>
等等
以下是我的外部样式表的代码:
.container {margin:0 2em;
text-align: center;
position: relative;}
(一堆代码,然后:)
.under_menu{background-color: rgb(141, 0, 212);
width:auto;
height: 1em;
padding-bottom: 0;}
.the_background{background-color: yellow;
background-image: url('images/bg.png');
width: auto;
height: 100%;
background-size: cover;
z-index: -10;
position: absolute;
left: 0;}
(一堆更多的代码等)
我最终想要的(因为我不能发布图像)是背景图像从 under_menu div 的底部开始,也占据与它相同的宽度,并在页面的其余部分继续。目前,under_menu div 是完美的——它跨越整个页面,但每边的边距很小(50%),并且高度为 1em。
我目前复制的这段代码没有给我任何东西。到底为什么会这样???!!!我整天都在玩这个,并设法在某些时候显示黄色后备颜色或背景图像,但我无法控制它的宽度或高度。我已经修改了我可以识别的所有相关属性!如果有人可以帮助我,我将不胜感激。如果有人也可以解释为什么我粘贴在那里的代码不起作用,那也很好。
非常感谢您提前!!!
ps是的,我一直在检查拼写和语法等三重检查:/