简介元素居中显示

居中显示我们一般会用text-align:center。但是这个仅限于行内元素，而不能用于块状元素。

（

行内元素：比如<label>、<span>、<a>这些不会自己独占一行的元素，高度、宽度、边距不可以调节。

块状元素：比如<div>、<table>，<form>这些自己独占一行的元素，并且宽度默认是100%，高度、宽度、边距都可以调节。

）

块状元素设置居中方法

分为宽度固定的块状元素和不固定块状元素。

固定宽度

固定宽度的块状元素如下设置：

margin: 10px auto;　　//左右设为auto

不固定宽度

三种解决方案：

1.采用table将这个块状元素包裹

2.使用dispplay:inline设为行内元素。

3.绝对定位偏移

table方法

<style>
table{
　　margin:0 auto;
}
</style>
<table>
　　<tbody>
　　　　<tr>
　　　　<td>
　　　　　　<div>不固定宽度div</div>
　　　　</td>
　　　　</tr>
　　</tbody>
</table>

原理：table宽度由内容决定，因此这个table宽度是由div文字决定宽度，可以看作是固定宽度了，采用固定宽度的解决办法就可以了。

inline方法div{

    dispplay:inline
　　text-align:center

}

偏移方法

 通过使用绝对定位设置偏移量但不如上面的方式。