+ -
当前位置:首页 → 问答吧 → CSS布局

CSS布局

时间:2011-11-04

来源:互联网



[size=18px]
CSS样式:
.wraper{width:900px;background:#ccc;font-size:18px;}
.wraper .content{width:550px;height:200px;float:right;}
.wraper .content .content{width:220px;height:200px;float:left;background:#333;display:inline;}
.wraper .content .second{width:250px;height:200px;float:right;background:#999;display:inline;}
.wraper .primary{width:320px;height:200px;background:#f00;/*display:inline;*/}
HTML:
<div class="wraper">
<div class="content">
<div class="content"></div>
<div class="second"></div>
</div>
<div class="primary">呵呵呵</div>
</div>
问题:::
样式中的最后一条注释的规则应用后,这个div就看不到了??为什么。。求权威解释。。。谢谢。。


[/size]

作者: cheng3269656   发布时间: 2011-11-04

楼主我整理了一下代码,没发现什么问题啊
HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>无标题 1</title>
<style type="text/css">
.wraper {
    width: 900px;
    background: #ccc;
    font-size: 18px;
}
.wraper .content {
    width: 550px;
    height: 200px;
    float: right;
}
.wraper .content .content {
    width: 220px;
    height: 200px;
    float: left;
    background: #333;
    display: inline;
}
.wraper .content .second {
    width: 250px;
    height: 200px;
    float: right;
    background: #999;
    display: inline;
}
.wraper .primary {
    width: 320px;
    height: 200px;
    background: #f00;/*display:inline;*/
}
</style>
</head>

<body>

<div class="wraper">
    <div class="content">
        <div class="content">
        </div>
        <div class="second">
        </div>
    </div>
    <div class="primary">
        呵呵呵</div>
</div>

</body>

</html>

作者: sunen2011   发布时间: 2011-11-06