<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>浮动具体表现形式</title>
<style type="text/css">
.class1
{
width: 300px;
height: 200px;
background: wheat;
/*float: left;*/
/*position: absolute; 定位属性 可注释float查看效果 定位是完全脱离文档流,所以div3的一些文字被覆盖了 但是float是半脱离文档流 所以div3文字会自动环绕*/
}
.class2
{
width: 400px;
height: 300px;
background: yellowgreen;
float: right;
}
.class3
{
width: 500px;
height: 400px;
background: saddlebrown;
}
.a
{
width: 400px;
height: 300px;
background: yellowgreen;
float: left;
}
.b
{
width: 500px;
height: 400px;
background: saddlebrown;
}
.a1
{
width: 400px;
height: 300px;
background: yellowgreen;
float: left;
}
.b1
{
width: 500px;
height: 400px;
background: saddlebrown;
}
</styl
HTML5学习_day05(4)--html之float具体表现
最新推荐文章于 2022-06-01 22:09:36 发布