初步学习css，看过之后容易忘记，在此做一下记录。
一、margin介绍
margin：10px；代表上、右、下、左分别10px
margin：10px 10px；代表上下、左右分别10px
margin：10px 10px 10px；代表上、左右、下分别10px
margin：10px 10px 10px 10px；代表上、右、下、左分别10px
margin：0 auto;代表上下0px，左右自适应，显示为横向居中
二、float介绍
（1）设置float就代表脱离了正常的文档流，设置一个div靠左，一个div靠右，可以设置float：left；float：right属性来实现
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>固定定位</title>
<style>
* {
margin: 0;
padding: 0;
}
.content_div {
width: 100px;
height: 100px;
border: 1px solid #000;
float: left;
margin: 10px;
}
.small_div {
width: 100px;
height: 100px;
border: 1px solid #000;
float: right;
margin: 10px;
}
</style>
</head>
<body>
<div class="content_div">
</div>
<div class="small_div"></div>
</body>
</html>（2）float排列方式是以头部对其来排列的，遵循：浮动找浮动，不浮动找不浮动的规则来排列
三、文字包围图片效果
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css的一些属性</title>
<style>
.left{
float: left;
}
</style>
</head>
<body>
<div class="left">
<img src="img/bg1.png" />
</div>
<p>轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
轻轻地我走了，正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。
正如我轻轻地来，我挥一挥衣袖，不带走一片云彩。</p>
</body>
</html>
166
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
