我是无表布局的新手,最近在表格布局中设计的网站。现在将表格布局转换为无表布局。我正在使用网站的背景图像。我在包装器div 中遇到问题,我给包装器div 提供了背景颜色和阴影,但它不适用。引导我出错的地方
.HTML:
<body>
<div id="wrapper">
</div>
</body>
.CSS:
body
{
background-image:url(../images/site-bg-5.jpg);
}
#wrapper {
width: 950px;
height:1500px;
margin: 0 auto;
background-color: #FFF;
box-shadow: 0 0 10px #000;
border: 1px solid #000;
}
我遇到问题,包装器div 有阴影和边框,但它具有特定的高度。 我希望阴影和边框高度自动调整包装器div 的高度。 向工作小提琴展示执行此操作的正确方法。
"#"和单词"wrapper"之间有一个空格。删除它,它应该可以工作。
这应该是最终的 css:
body{
background-image:url(../images/site-bg-5.jpg);
}
#wrapper {
width:950px;
margin:0 auto;
background-color:#FFF;
box-shadow: 0 0 10px #000;
border:1px solid #000;
}
#wrapper
是正确的
body {
background-image: url(../images/site-bg-5.jpg);
}
#wrapper {
width: 950px;
margin: 0 auto;
background-color: #FFF;
box-shadow: 0 0 10px #000;
border: 1px solid #000;
}
<body>
<div id="wrapper">
df
</div>
</body>
试试这个css
body{background-image:url(../images/site-bg-5.jpg); }
#wrapper{width:950px;margin:0 auto;background-color:#FFF;box-shadow: 0 0 10px #000;border:1px solid 000;}
删除#和包装器之间的空格,它将起作用
还要添加height
这是工作小提琴:演示
在此处查看演示:查看演示
#wrapper {
width:950px;
margin:0 auto;
background-color:#FFF;
box-shadow: 0 0 10px #000;
border:1px solid #000;
}