css布局左邊固定右邊自適應(yīng) css能不能實(shí)現(xiàn)左邊div固定寬度,右邊div自適應(yīng)撐滿剩下的寬度?
css能不能實(shí)現(xiàn)左邊div固定寬度,右邊div自適應(yīng)撐滿剩下的寬度?它可以用很多方法實(shí)現(xiàn),最簡單的方法是使用display:table,但是它不兼容IE7及以下的瀏覽器,但是現(xiàn)在我們可以放棄這些瀏覽器
css能不能實(shí)現(xiàn)左邊div固定寬度,右邊div自適應(yīng)撐滿剩下的寬度?
它可以用很多方法實(shí)現(xiàn),
最簡單的方法是使用display:table,但是它不兼容IE7及以下的瀏覽器,但是現(xiàn)在我們可以放棄這些瀏覽器
<style>
HTML,body{height:100%}。方框{顯示:表格寬度:100%}。左,。右{顯示:表格單元格高度:100%}。左{寬度:300px背景:#F00}。右{背景:#ff0}
</style>
<div class=“box”>
<div class=“l(fā)eft”>固定寬度區(qū)域</div>
<div class=“Right”>我是自適應(yīng)的</div>
</div>
,例如。左{位置:絕對寬度:300px}
。右{邊距-左:300px}
請自己試試
css能不能實(shí)現(xiàn)左邊div固定寬度,右邊div自適應(yīng)撐滿剩下的寬度?
flex怎么讓左邊自適應(yīng)右邊固定?
沒有JS或浮動(dòng),您可以直接使用CSS來完成此布局。主要代碼如下:#邊欄,#容器{min}-高度:400px/*根據(jù)具體情況*/}側(cè)邊欄{寬度:210px背景色:#ebb058位置:絕對頂部:0 左:0}#容器{邊距-左:2。