css之水平居中设置

• 行内元素：     div,p{text-align:center;}

• 定宽块状元素:  第一宽度固定，第二margin-left和margin-right均是auto。div{border:1px solid red;width:200px;margin:20px auto;}

• 不定宽块状元素方法

1. 加入 table 标签（ 包括 <tbody>、<tr>、<td> )。

2. 设置 display: inline 方法：与第一种类似，显示类型设为 行内元素，进行不定宽元素的属性设置,设置 position:relative 和 left:50%：利用 相对定位 的方式，将元素向左偏移 50% ，即达到居中的目的。{display:inline; position:relative; left:50%;}

3. {display:table; margin:0 auto;}也可以是实现

 

 

1. 设置 display: inline 方法：先设置为行内元素，再设置center，这种一般针对ul和ol。如如所示：

2. 通过给父元素设置 float，然后给父元素设置 position:relative 和 left:50%，子元素设置 position:relative 和 left: -50% 来实现水平居中