做前端的时候水平居中很容易做到。垂直居中一般怎么做呢?

2015-08-15 08:00:07 +08:00
 cevincheung
//水平居中是在一条横向的直线的中点是吧?

水平居中的话一般都是margin:0 auto;就可以了。垂直呢?有什么简单的方法么?

4801 次点击
所在节点    前端开发
27 条回复
arzusyume
2015-08-15 13:28:08 +08:00
不怎么动脑子的写法...
position:absolute;
top: 0;
bottom: 0;
margin: auto

加上left: 0, right:0 还能绝对居中...
an168bang521
2015-08-15 13:34:46 +08:00
.test{width: 400px;height: 400px;background: orange;position: absolute;top: 50%;left: 50%;margin: -200px 0 0 -200px;}
我是这么写的;
Clauz
2015-08-15 15:29:21 +08:00
jsonline
2015-08-15 15:30:12 +08:00
不会搜索?
guoqiao
2015-08-15 15:32:25 +08:00
@Clauz 终于有人贴出这个链接了。读了它,再也不操心居中问题。
zindex
2015-08-15 22:31:56 +08:00
yuandong
2015-08-16 11:34:01 +08:00
用transform

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/213335

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX