Css实现垂直水平居中的六种方法_html/css_WEB-ITnose

经常在项目中用到，今天总结了一下：

演示地址：http://codepen.io/anon/pen/xGdpOa

以下两个类为公共类，便于更好的显示效果，非核心代码

	.common{		width: 600px;height: 180px;		background-color:#56abe4;		color: #fff;		margin: 15px auto; 		border-radius: 3px;	   }	.con{		display: inline-block;		padding: 15px;		width: 160px;		height: 80px;		background-color: orange;	} 

　　

正文部分：

第一种方法：

/*position: absolute;top:0;right: 0;bottom: 0;left: 0;margin: auto;*/

HTML结构：

	
		position: absolute;		top:0;right: 0;bottom: 0;left: 0;		margin: auto;

      
查看更多关于Css实现垂直水平居中的六种方法_html/css_WEB-ITnose的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did108297