整理一下关于块和文字的水平垂直居中，这些是我们平时调样式时经常遇到的。
dom结构，在浏览器中实现块及其文字的水平垂直居中
<body> <div class="parent"></div> </body> 共同样式： * { margin: 0; padding: 0; }方法1:
.parent { width: 200px; height: 200px; position: absolute; margin: auto; left: 0; right: 0; top: 0; bottom: 0; border: 1px solid; } 方法2: .parent { width: 200px; height: 200px; position: absolute; left: 50%; top: 50%; margin-left: -100px; margin-top: -100px; border: 1px solid }方法3（不知宽高的情况下）:.parent { width: 50%; height: 50%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border: 1px solid; }方法4:body { display:flex; justify-content:center; align-items: center; height: 400px; } .parent { width: 200px; height: 200px; border: 1px solid; }方法5:body{ display: table-cell; vertical-align: middle; width: 500px; height: 500px; border: 1px solid; } .parent { width: 200px; height: 200px; border: 1px solid; margin: 0 auto; }
