<html>
<head>
<title>css 盒子模型</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8"/>
<style type="text/css">
div{
width:300px;
height:300px;
}
#h1{
width:650px;
}
#h2{
width:650px;
}
#d1{
border:solid 1px red;
float:left;
margin-right: 10px;
}
#d2{
border:solid 1px yellowgreen;
float:left;
}
#d3{
border:solid 1px orange;
float:left;
margin-right:10px;
}
#d4{
border:solid 1px magenta;
float:left;
}
#h1,#h2{
width:650px;
margin-top:20px;
margin:auto;
}
</style>
</head>
<body>
<h3 align="center">css 盒子</h3>
<hr size="30" color="aquamarine"/>
<div id="h1">
<div id="d1">
1
</div >
<div id="d2">
2
</div>
</div>
<div id="h2">
<div id="d3">
3
</div>
<div id="d4">
4
</div>
</div>
</body>
</html>
css 盒子模型布局案例
最新推荐文章于 2024-06-22 17:15:40 发布