CSS 水平居中

 

目录

1.内容居中

2.元素居中

---

 

 

 

 

 

1.内容居中

<style>
div{
  border:1px solid lightgray;
  margin:10px;
}
</style>
<div align="center">
通过设置属性align="center" 居中的内容
</div>
 
<div  style="text-align:center">
通过样式style="text-align:center" 居中的内容
</div>

2.元素居中

margin:0 auto === margin:0 auto 0 auto 所有left和right自动设置，也就是适应宽度居中

<div style="width: 300px;margin: 0 auto;">
			通过margin：0    auto来使得元素居中
		</div >
		<span  style="width: 300px;margin: 0 auto;">
			而span设置同样的格式，就不行
		</span>
		<div style="text-align: center;">
			<span >
				span的居中可以通过放置在div中，然后让div text-align实现居中
			</span>
		</div>