css中，用flex和百分比优势劣势

html-css023

css中，用flex和百分比优势劣势,第1张

flex更好点,由源代码进行控制布局,一般不会乱掉,但是百分比有些浏览器对边框,和间距定义不同,再加上有的时候你需要给标签加上一些px,会导致百分比不能按预想的样子出现,而且不能微调百分比的设定,不够灵活,相对flex布局就好多了,由源代码进行控制,也不担心额外像素,只要浏览器兼容就可以

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

<style>

*{padding:0margin:0}

.box{

width:80%

height:200px

margin:auto

display:flex

flex-direction: row

border:1px solid #000

}

.box>div{

height:100%

flex:1

background:red

}

.box>div:not(:first-child){

margin-left:15px

}

</style>