css怎样设置 div平均分配满

html-css026

css怎样设置 div平均分配满,第1张

给两种方法：

第一种：百分比。使用均分的百分比宽度。

第二种：css3弹性布局。父级给定宽度display:flexflex-direction:row子元素全部设置flex:1；

用百分比来做，比如html如下

<div class="demo">

    <div class="box">1</div>

    <div class="box">2</div>

    <div class="box">3</div>

</div>

css如下

.demo{width: 1000pxheight: 300px}

.box{width: 100%height: 33.3%}

效果就是demo被box均分为3个宽1000高100的三个块，当然，3个33.3%是不能完全达到百分百，但在显示界面基本看不出什么了