CSS布局实战案例-优快云博客

本文链接：https://blog.youkuaiyun.com/epu2014/article/details/41941805

<html>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>无标题文档</title>
<style type=”text/css”>
body{
margin:15px;
font-family:Arial;
font-size:12px;
}
.father{
background-color:#ffff99;
border:1px solid #111111;
padding:5px;
}
.father div{
background-color:;

margin:15px;
padding:10px;
}
.father p{
border:1px dashed #111111;
background-color::#ff90ba;
}
.son1{
/*这里设置son1的浮动方式*/

border:1px dashed #111111;
}
.son2{
background-color:#6FF;
border:1px solid #111111;

}
.son3{
background-color:#0F6;
border:1px dashed #111111;
}
</style>
</head>
<body>
<div class=”father”>
<div class=”son1″>Box-1</div>
<div class=”son2″>Box-2</div>
<div class=”son3″>Box-3</div>
<p>这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，这里是浮动框外围的文字，
</p>
</div>
</body>
</html>

css盒子的浮动一