问题缘起
<!-- <!doctype html> --><!--此处不加doctype 就没有垂直居中，但是加了html5 的doctype，就垂直居中了-->
<html>
<head>
<meta charset="utf-8">
<title>为什么粉色块没有垂直居中</title>
</head>
<body>
<style type="text/css" media="screen">
.parent{
height:450px;
line-height:450px;
background:red;
text-align:center;
}
.child{
display:inline-block;
background:pink;
width:32px;
height:32px;
line-height:normal;
vertical-align:middle;
}
</style>
<div class="parent">
<div class="child"></div>
</div>
</body>
</html>
学习点整理
DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。
