1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
|
<style type=
"text/css"
>
#outer{
display: flex;
width: 100%;
flex-flow: row nowrap;
}
.left,.right{
width:200px;
height:50px;
background: red;
}
.middle{
flex-grow: 1;
//决定如何分配剩余空间
background: yellow;
}
</style>
<body>
<div id=
"outer"
>
<div
class
=
"left"
>left</div>
<div
class
=
"middle"
>middle</div>
<div
class
=
"right"
>right</div>
</div>
|
FLEX实现两侧边栏固定中间自适应布局
最新推荐文章于 2024-06-26 11:38:48 发布