记录一个实现居中弹框的css代码片

html结构

	<div class="content">
		<div class="dialog"></div>
	</div>

css代码

	       .content{
			font-size:0;
			position: fixed;
                        left:0;top:0;bottom: 0;right: 0;
			text-align: center;
			background:rgba(0,0,0,.5);
			overflow: auto;
		}
		.content:after{
			content:'';
			display:inline-block;
			height:100%;
			vertical-align:middle;
		}
		.dialog{
			width:200px;height:200px;
			background:#fff;
			vertical-align: middle;
			display: inline-block;
		}

效果如下：