本文主要和大家分享css实现p居中的方法，css代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友参考下，希望能帮助到大家。
下面给大家分享p居中的实现代码，具体代码如下所示：
demo
如上的两个p，实现p2在p1里面是居中显示
一、方法一
立即学习“前端免费学习笔记（深入）”；
利用margin，p1的宽减去p2的宽就是p2margin-left的数值：（100-40）/2=30
p1的高减去p2的高就是p2margin-top的数值：（100-40）/2=30
demo
二、方法二
利用css的 position属性，把p2相对于p1的top、left都设置为50%，然后再用margin-top设置为p2的高度的负一半拉回来，用marg-left设置为宽度的负一半拉回来，css如下设置
demo
三、方法三
还是用css的position属性，如下的html
demo
四、方法四
利用css3的新增属性table-cell
demo
这个方法还有一个好处就是，p2的高度可以不固定，如下
demo
p居中方法
相关推荐：
