第一种,都向左浮动, width 各占相应百分比
(注意div1 ,div2 有padding margin 等属性会影响宽度 )
两div高度可以不一样,
div1 15% + div1 85% = 100% 宽
<style>
.div1 {
float: left; width: 15%;
background-color: lightseagreen;
}
.div2 {
float: left; width: 85%;
background-color: chocolate;
}
</style>
第二种 仅div1 左浮动,div2 100%宽(不浮动), div1 自然覆盖在div2上,再对div2做相应处理。
这种适合左边的高度 大于或等于右边的高度。
.div1 {
float: left; width: 15%;
background-color: lightseagreen;
}
.div2 {
width: 100%;
background-color: chocolate;
}
</style>
两div高度可以不一样,
div1 15% + div1 85% = 100% 宽
<style>
.div1 {
float: left; width: 15%;
background-color: lightseagreen;
}
.div2 {
float: left; width: 85%;
background-color: chocolate;
}
</style>
第二种 仅div1 左浮动,div2 100%宽(不浮动), div1 自然覆盖在div2上,再对div2做相应处理。
这种适合左边的高度 大于或等于右边的高度。
.div1 {
float: left; width: 15%;
background-color: lightseagreen;
}
.div2 {
width: 100%;
background-color: chocolate;
}
</style>