css样式设置元素居中的最简便方式 左右居中或垂直居中
左右居中
.class {
width: 960px;
margin: 0 auto;
}垂直居中方式
父元素需要设置position为非static定位，如果需要左右也居中，加上left: 0;right: 0;即可。
.vMiddle {
width: 100px;
height: 100px;
position: absolute;
top: 0;
bottom: 0;
margin: auto;
}样例代码
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
.middle {
position: absolute;
height: 100px;
width: 100px;
top: 0;
bottom: 0;
background-color: black;
margin: auto;
}
</style>
</head>
<body>
<div style="position:relative;width:200px;height:600px;background-color: aliceblue;">
<div class="middle">
</div>
</div>
</body>
</html> 相关推荐
drdrsky 2020-06-16
PioneerFan 2020-06-10
HSdiana 2020-03-28
lyg0 2020-03-07
冰蝶 2020-01-10
玫瑰小妖 2019-12-31
行吟阁 2019-12-08
aiolos 2016-04-15
loverlucky 2016-03-15
WebVincent 2019-07-01
云端漂移 2019-07-01
renpinghao 2019-06-30
kbkiss 2019-06-29