css 一个div里套了四个小div 如何让他们自动分配间距,高度被设定的情况下。

<divstyle="width:200px;height:200px;"><divstyle="width:200px;height:20px;">fdsfas</di... <div style="width:200px;height:200px;">
<div style="width:200px;height:20px;">fdsfas</div>
<divstyle="width:200px;height:20px;">fdsfas</div>
<div style="width:200px;height:20px;">fdsfas</div>
<div style="width:200px;height:20px;">fdsfas</div>
</div>

没说清楚,我这个现在是垂直的,要垂直间距自动分配。
展开
 我来答
故事与酒与老友
2015-10-10 · TA获得超过111个赞
知道答主
回答量:37
采纳率:100%
帮助的人:16.8万
展开全部

利用CSS3 新添加的盒子模型属性 box-flex;可以让子容器针对父容器的宽度按一定规则进行划分。ie 目前不支持,估计后续版本会兼容这个属性。

必须在父元素上面加上display:box; 才可以对子元素进行规则划分。

box-flex:1;这里的 1 指的是比例 。

如:

<!DOCTYPE html>
<head>
    <title></title>
    <style>
        .box {
     width: 200px; /*宽度没有限制*/
     height: 200px;
    display: -webkit-box; /*这个必须要有*/
      -webkit-box-orient:vertical; /* 默认横向划分  vertical 为纵向划分*/  
}
.box div{
height:100%;
}
.div1{
background-color:red;
-webkit-box-flex:1;
}
.div2{
background-color:blue;
-webkit-box-flex:1;
}
.div3{
background-color:green;
-webkit-box-flex:1;
}
.div4{
background-color:darkblue;
-webkit-box-flex:1;
}
    </style>
</head>
<body>
    <div class="box">
        <div class="div1"></div>
 
        <div class="div2"></div>
 
        <div class="div3"></div>
        
        <div class="div4"></div>
    </div>
</body>
</html>
友安非标自动化设备
2013-05-07
知道答主
回答量:11
采纳率:0%
帮助的人:8.7万
展开全部
<div id="a">
    <div class="b">fdsfas</div>
    <div class="b">fdsfas</div>
    <div class="b">fdsfas</div>
    <div class="b">fdsfas</div>
</div>
#a{width:200px; height:200px;}
.b{width:200px; height:20px; margin:10px auto;}
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
云冕di
2013-05-06 · TA获得超过433个赞
知道答主
回答量:138
采纳率:100%
帮助的人:105万
展开全部
DIV是不会像TABLE那样的,宽度还是定义死的好,或者子继承父。为了IE6及其他浏览器都是最好定义死宽度的。

垂直也不会自动分配啊。如果能自动的话那估计得借助JS了!反正我玩CSS几年了,没做过这事!
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
百度网友bfcbad5
2015-09-21 · TA获得超过567个赞
知道小有建树答主
回答量:826
采纳率:100%
帮助的人:199万
展开全部
把他们的宽都设成百分比的 25%即可
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
红字廒街29号
2013-05-06 · TA获得超过322个赞
知道小有建树答主
回答量:285
采纳率:0%
帮助的人:196万
展开全部
分别给父级和子级div设置class吧
margin或者padding这些属性你自己看着用
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(4)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式