no.1 使用浮動:float
left
right
實現效果:.use-float .left
.use-float .right
no.2 使用浮動:flex
left
right
實現效果:.use-flex
.use-flex .flex-left
.use-flex .flex-right
no.3 使用浮動:margin
left
right
實現效果:.use-margin .tleft
.use-margin .tright
no.4 使用浮動:padding
left
right
實現效果:.use-padding .l
.use-padding .r
no.5 使用浮動:position
left
right
實現效果:.use-position
.use-position .lef
.use-position .rig
no.6 使用浮動:table
left
right
實現效果:.use-table
.use-table > tbody > tr > td:first-child
no.7 使用浮動:float+display:block
left
right
實現效果:.use-to .le
.use-to .ri
css左邊固定,右邊自適應
lang en charset utf 8 title head class container class left div class right div div body html 方法1 左邊div使用float left left right style 方法2 將外部容器div設定dis...
css 布局小技巧 左邊固定右邊自適應
在頁面布局或者是列表布局中,我們經常出現乙個場景 左邊是固定寬度的盒子,右邊自適應 divclass product open labelclass label open product label 這一列是固定寬度 ulclass check game 這一列自適應 li label inputt...
解決左邊寬度固定,右邊寬度隨瀏覽器自適應的3種方案
在前端開發中,不管是自己寫專案,還是應試,都會遇到這樣乙個問題,實現左邊寬度固定,右邊寬度隨瀏覽器的變化而變化,在這個問題上衍生出來的還有一種場景,明明設定了固定寬度,卻出現變形的現象,今天就給大家分享一下解決方案。思路 父元素設定 display flex 左邊元素給固定的 flex basis ...