使用Sass优雅并高效的实现CSS中的垂直水平居中(附带Flex布局，CSS3+SASS完美版)-前

实现css水平垂直居中的方法有很多，在这里我简单的说下四种比较常用的方法：

1.使用CSS3中的Flex布局

对于flex，我们要了解的是它是一个display的属性，而且必须要给他的父元素设置flex属性(flex必须配合绝对定位使用！！！！！)，除了设置display：flex之外，还有另外两个属性需要设置，分别是justify-content和align-items，他们的意思分别是水平居中和垂直居中。HTML+CSS代码如下：

 body  { 
    position :  absolute ; 
    width :  100% ; 
    height :  100% ; 
    display :  flex ; 
    justify-content :  center ; 
    align-items :  center ;
} 
.parentNode  { 
    width :  400px ; 
    height :  400px ; 
    background :  #f00 ;
} 

查看更多关于使用Sass优雅并高效的实现CSS中的垂直水平居中(附带Flex布局，CSS3+SASS完美版)-前的详细内容...