margin赋值，float属性介绍
初步学习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排列⽅式是以头部对其来排列的，遵循：浮动浮动，不浮动不浮动的规则来排列
三、⽂字包围图⽚效果
margin属性怎么用
<!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>

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。