解决方法1:浮动
- 将左右两列的宽度设置为固定值,左边第一个的div左浮动,右边的元素有浮动;
- 但此时,由于第一个元素浮动,中间的元素未浮动,所以第一个div会覆盖在第二个div上,并且挤掉第二个div的内容,
- 由于浮动的元素脱离文档流,所以第三个div,会掉下去;所以只要将第二个没有浮动的div放在最后即可,这样在设置它的margin即可;
三列布局
解决方法2:弹性盒模型 (必须加一个父模型,才可以用!!!!!),将父元素转化为为弹性盒模型(display:flex;) 在子元素中写占的份数;
三列布局
解决方法3:定位:将左右固定的div先用绝对定位(此时相对于body定位,脱离文档流)固定,再设置中间元素的左右margin;
三列布局 22