尽量不用js<!DOCTYPE HTML><html lang="en-US"><head>
<meta charset="UTF-8">
<title></title></head><body>
<p>垂直居中</p></body></html>
3 回答
料青山看我应如是
TA贡献1772条经验 获得超8个赞
HTML：
<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8"> <title></title></head><body> <div id="c"> <p>垂直居中</p> </div></body></html>
CSS：
#c { display:table; height:400px;
}#c p { display: table-cell; vertical-align: middle;
}
紫衣仙女
TA贡献1839条经验 获得超15个赞
1、table-cell方法，ls有讲
2、如果知道子元素高度的话，可以有另一种好点的办法。假设子元素高度是100px。可以把父元素设为position: relative；然后父元素和子元素中间加一层position: absolute; top: 50%的div；最后最里面的子元素position: relative; top: -50px;
3、如果不用担心浏览器兼容性的话，可以用CSS transform（但是IE6-8不支持）。类似方法二，但是不需要知道元素高度。子元素最后向上平移(translate) 50%即可。
幕布斯7119047
TA贡献1794条经验 获得超8个赞
对于不固定宽高的元素要居中的方法：父类div设置text-align:center.该需要居中的元素设置display:inline-block
- 3 回答
- 0 关注
- 257 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消