margin 是设置工具四边的外延边距，被称为外补丁或外边距。
这两个属性相信大家都知道是什么，但是在实际的运用中，总是会有一些疑问？或者不知道该怎么用，接下来上代码
1，text-align的水平对齐
```css
.text{
width: 1000px;
height: 40px;
background: pink;
text-align: center;/ 笔墨水平居中/
}
```
```html
<p class="text">玉轮不睡你不睡，你是光头小宝贝</p>
```
如果用浏览器打开是能看出来笔墨在宽度为1000的范围内是水平居中的，一点毛病没有。但是如果把p标签换成了span标签，你会创造它就无法居中了，由于span标签是个内联元素，不认识宽度和高度，也便是说当前span标签的宽度实在便是笔墨撑开的宽度，没有剩余的空间，以是text-align就无法进行水平居中。
```html
<span class="text">玉轮不睡你不睡，你是光头小宝贝</span>
```
2，margin:0 auto的对齐
我们知道margin:0 auto,是让一个元素在哪个范围里水平居中，那么条件还是得有一个宽度，比如
```html
.all{width: 1600px;}
.text{
width: 1000px;
height: 40px;
background: pink;
margin: 0 auto;
}
<div class="all">
<p class="text">玉轮不睡你不睡，你是光头小宝贝</p>
</div>
```
由于.all有个宽度为1600px，以是.text的宽度1000在1600的范围里有剩余600的空间，以是margin:0 auto是可以进行元素的水平居中，但是如果.text里没有宽度1000，那么元素是不会进行居中的，由于p标签是个块元素，块元素的宽度不写则为100%，这时.text的宽度就变成了1600，没有剩余空间，以是无法进行居中。
同样，如果p标签换成了内联元素的标签如span，也是无法进行居中的，由于span不认识宽度和高度
```html
.text{
width: 1000px;
height: 40px;
background: pink;
margin: 0 auto;;
float:left; }
```
如果添加了左浮动(float：left)这时margin:0 auto，也无法进行水平居中，由于给元素添加了浮动，就相称于转了元素类型为inline-block（内联块元素），那么内联元素是不支持margin:0 auto的。
总结：
1,如果是内联元素或者内联块元素想让在容器中水平居中就可以用text-align:center,条件是必须得有一个剩余空间，并且加给父元素，由于text-align属性可以继续。常用的内联元素和内联块元素标签有，a span b strong i em input img select textarea等
2,如果是块元素想让让标签在容器中水平居中就用margin:0 auto;条件也是要有一个范围的剩余空间。
常用的块元素标签有p h1 h2 h3 h4 h5 h6 form div ul li ol dl dt dd等
