极客观点
项目管理
HarmonyOS
<!DOCTYPE html>
<html>
<head>
<title>css3Grid</title>
<style type="text/css">
.one{
background-color: red;
}
.two{
background-color: yellow;
}
.three{
background-color: green;
}
.three-column{
width: 100%;
height: 500px;
display: box;
display: -webkit-box;
}
.two{
-webkit-box-flex:1;
}
.one, .three{
-webkit-box-flex:0 0 200px;
}
</style>
</head>
<body>
<div class="three-column">
<div class="one">
1
</div>
<div class="two">
2
</div>
<div class="three">
3
</div>
</div>
</body>
</html>上述代码本来想试试两边宽度固定，中间宽度自适应的，后来发现在实践过程中-webkit-box-flex:0 0 200px;并不起作用。
请问该怎么改才可以呢？
你的问题也写错了吧，是想实现中间自适应，两边固定的吧。
其实flex布局的话，自适应的不服加上flex属性，其他固定的部分直接加上宽度就可以了。
如果是要实现中间固定，两边自适应，就把样式对调一下就好了。
flex兼容性比较差，记得要把该加的浏览器兼容方案都加上去。