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

<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

利用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>

温馨提示：内容为网友见解，仅供参考

当前网址：https://11.t2y.org/zz/2s44vv247.html

其他看法

第1个回答 2013-05-07

<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;}

本回答被提问者采纳

第2个回答 2013-05-06

DIV是不会像TABLE那样的，宽度还是定义死的好，或者子继承父。为了IE6及其他浏览器都是最好定义死宽度的。

垂直也不会自动分配啊。如果能自动的话那估计得借助JS了！反正我玩CSS几年了，没做过这事！

第3个回答 2015-09-21

把他们的宽都设成百分比的 25%即可

第4个回答 2013-05-06

分别给父级和子级div设置class吧
margin或者padding这些属性你自己看着用

1 2 下一页

相似回答

大家正在搜