問(wèn)題描述

無(wú)論瀏覽器寬度怎么改變，都保證左邊這個(gè)div寬度固定為300px，右邊寬度隨瀏覽器寬度自適應(yīng)，且兩個(gè)div的高度和瀏覽器當(dāng)前高度一致

問(wèn)題解答

css如何實(shí)現(xiàn)兩欄布局，左邊固定寬度，右邊寬度自適應(yīng)，且高度和瀏覽器當(dāng)前高度一致？-PHP中文網(wǎng)問(wèn)答-css如何實(shí)現(xiàn)兩欄布局，左邊固定寬度，右邊寬度自適應(yīng)，且高度和瀏覽器當(dāng)前高度一致？-PHP中文網(wǎng)問(wèn)答

圍觀一下哦，學(xué)習(xí)一下。

#left { position: fixed; left: 0; top: 0; height: 100vh; width: 300px; /* background: blue; *//* 解開(kāi)此處注釋來(lái)查看效果 */}#right { position: fixed; left: 300px; top: 0; height: 100vh; width: calc(100vw - 300px); /* 如果瀏覽器不支持CSS3 calc方法，可以使用js計(jì)算寬度 */ /* background: red; *//* 解開(kāi)此處注釋來(lái)查看效果 */}