左邊固定，右邊自適應布局的兩種實現
阿新 • • 發佈：2017-05-09
定位 abs red logs light 正常 idt blue mar
html結構:
<body> <div class="left"></div> <div class="right"></div> </body>
第一種：float實現，左邊浮動+右邊正常文檔流
html,body{
width: 100%;
height: 100%;
}
.left{
float:left;
width: 300px;
height: 100%;
background: red;
}
.right{
height: 100%;
background: blue;
}
第二種：position定位脫離文檔流+margin
html,body{
width: 100%;
height: 100%;
}
.left{
width: 300px;
position: absolute;
height: 100%;
background: red;
}
.right{
margin-left: 300px;
height: 100%;
background: blue;
}
左邊固定，右邊自適應布局的兩種實現