做div测试:设置背景:style=“background-color:xxx; margin-top:xxx”
div之float,clear
1.未使用float属性,设置width和height测试,自动占满整行
2.float:浮动属性:本测试界定都浮动到左边
测试1.假设四个div,width分别为300,100,100,100,若添加第五个div则规则布局
测试2.假设四个div,width分别为300,100,100,150,若添加第五个div则出现左下角50pxwidth无法使用
测试3.浮动属性的消除:clear属性,假设三个div,都设置float,在第二三个div设置clear属性则规则布局,若只有第二个div设置clear(注意:第三个没有设置),则第三个会浮动到第二个之前。
测试4.父div使用相对定位,子div使用绝对定位,float的最后一个子div使用clear:right,所有子div在一行显示,不论是浏览器大小是否发生变化
3.总结:float:浮动div的内容,使得内容和需要占的大小适合,对下一个div影响
clear:消除前面所有只要设了float属性的div对本div的影响,使得本div不浮动上去。