CSS居中方法介绍

前言：

         我们在学习前端页面的时候，居中总是一个非常头痛的问题，我们要处理各个种种、零零碎碎的居中问题，下面我就介绍几种常用的需要居中的场景以及方法。

文字垂直居中

         文字垂直居中是一种比较常见的场景，如下图：

  logo 公司名称

我们该怎么设置其文字高度在图片右侧垂直居中呢？

CSS:     

.company{

       Height:图片高度；

       LineHeight：图片高度；

}

 

 

 

 

块元素垂直居中于父元素

这个方法就是将父元素设置为相对布局，将子元素设置成绝对布局，然后设置子元素的top值为父元素的一半，最后将子元素往上移动子元素的高度的一半。

CSS：

       .parent{

              postition:relative;

}

.child{

       postition:absolute;

       top:50%;

       margin-top:- chind的高度;

}

块元素在容器中水平居中

这个就是设置子元素的CSS：margin:0 auto;

注：如果子元素是绝对布局的话加上两行：

left:0;

right:0;