html 为什么侧边栏会在下面,container背景图片之在mainbox中显示?
<!DOCTYPE><html><head><styletype="text/css">*{margin=0;padding=0;}#header,#footer{wid...
<!DOCTYPE>
<html>
<head>
<style type="text/css">
*
{
margin=0;
padding=0;
}
#header,#footer
{
width:960px;
height:50px;
background-color:#F0F8FF;
}
#container
{
width:960px;
background:url(D:\360Downloads\a.jpg) repeat-y 0 0;
}
.mainbox
{
float;left;
width:650px;
}
.sidebox
{
float:right;
width:280px;
}
.mainbox, .sidebox
{
padding:0 5px;
color:#FF0000;
}
#container:after
{
display:block;
visibility:hidden;
font-size:0;
line-height:0;
clear:both;
content:"";
}
</style>
</head>
<div id="header">头部信息</div>
<div id="container">
<div class="mainbox">
<p>主要内容区</p>
<p>增加文字看看效果</p>
<p>两列等高的页面结构布局方式</p>
<p>可以算是一种“障眼法”</p>
<p>让浏览者在视觉上感觉到页面中的两列是相同高度的即可</p>
</div>
<div class="sidebox">侧边栏</p>
</div>
<div id="footer">底部信息</div>
</html> 展开
<html>
<head>
<style type="text/css">
*
{
margin=0;
padding=0;
}
#header,#footer
{
width:960px;
height:50px;
background-color:#F0F8FF;
}
#container
{
width:960px;
background:url(D:\360Downloads\a.jpg) repeat-y 0 0;
}
.mainbox
{
float;left;
width:650px;
}
.sidebox
{
float:right;
width:280px;
}
.mainbox, .sidebox
{
padding:0 5px;
color:#FF0000;
}
#container:after
{
display:block;
visibility:hidden;
font-size:0;
line-height:0;
clear:both;
content:"";
}
</style>
</head>
<div id="header">头部信息</div>
<div id="container">
<div class="mainbox">
<p>主要内容区</p>
<p>增加文字看看效果</p>
<p>两列等高的页面结构布局方式</p>
<p>可以算是一种“障眼法”</p>
<p>让浏览者在视觉上感觉到页面中的两列是相同高度的即可</p>
</div>
<div class="sidebox">侧边栏</p>
</div>
<div id="footer">底部信息</div>
</html> 展开
追问
加了之后还是一样,没有变化。
追答
*
{
margin=0;
padding=0;
}
#header,#footer
{
width:960px;
height:50px;
background-color:#F0F8FF;
}
#container
{
width:960px;
background:url(123.jpg) repeat-y 0 0;
}
.mainbox
{
float;left;
width:650px;
}
.sidebox
{
float:right;
width:280px;
background:#CCC;
}
.mainbox, .sidebox
{
padding:0 5px;
color:#FF0000;
}
#container:after
{
display:block;
visibility:hidden;
font-size:0;
line-height:0;
clear:both;
content:"";
}
头部信息
主要内容区
增加文字看看效果
两列等高的页面结构布局方式
可以算是一种“障眼法”
让浏览者在视觉上感觉到页面中的两列是相同高度的即可
侧边栏
底部信息
你可以把我的复制进去试试,图片的链接改成你自己的。。。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询