//水平居中是在一条横向的直线的中点是吧?
水平居中的话一般都是margin:0 auto;就可以了。垂直呢?有什么简单的方法么?
//水平居中是在一条横向的直线的中点是吧?
水平居中的话一般都是margin:0 auto;就可以了。垂直呢?有什么简单的方法么?
|
cqcn1991Aug 15, 2015 via iPhone
1
…老大难问题…
|
|
SeptembersAug 15, 2015 via Android
2
display: table-cell; vertical-align: middle;
但是要 定宽,定高 |
|
pagechoAug 15, 2015
3
|
|
sadscvAug 15, 2015 via Android
4
用line-height去控制。
|
|
5
http://www.zhangxinxu.com/wordpress/2013/11/margin-auto-absolute-%E7%BB%9D%E5%AF%B9%E5%AE%9A%E4%BD%8D-%E6%B0%B4%E5%B9%B3%E5%9E%82%E7%9B%B4%E5%B1%85%E4%B8%AD/
其实也很容易,比较神奇的是第三个。还有一种是inline元素参照来垂直居中,方式很多,看自己需要使用。 |
|
br00kAug 15, 2015
6
|
|
yakczhAug 15, 2015
7
table valign="middle"
|
|
neoneAug 15, 2015
8
|
|
lerryAug 15, 2015 via iPhone
9
|
|
lxrmidoAug 15, 2015
10
top:50%;
margin-top:-50%; |
|
airylandAug 15, 2015
11
top 50% 然后 margin translate -50% 就不用固定宽高了
|
|
coralineAug 15, 2015
12
|
|
mok502Aug 15, 2015 via Android
13
|
|
ik0rAug 15, 2015
14
比较先进的浏览器的话, 就用
position:absolute; top: 50%; left: 50; transform: translate(-50%, -50%); |
|
nineAug 15, 2015
15
|
|
ghostcatAug 15, 2015
17
|
|
jiongxiaobuAug 15, 2015 via Android
18
0 0根据不同情况有不同的方法
|
|
aivierAug 15, 2015
19
css-tricks上面有一个向导,可以根据不同需求告诉你该怎么做
|
|
tinyhillAug 15, 2015
20
容器 display: -webkit-box; -webkit-box-pack: center; -webkit-box-align: center;
|
|
arzusyumeAug 15, 2015
21
不怎么动脑子的写法...
position:absolute; top: 0; bottom: 0; margin: auto 加上left: 0, right:0 还能绝对居中... |
|
an168bang521Aug 15, 2015
22
.test{width: 400px;height: 400px;background: orange;position: absolute;top: 50%;left: 50%;margin: -200px 0 0 -200px;}
我是这么写的; |
|
23
|
|
jsonlineAug 15, 2015 via Android
24
不会搜索?
|
|
yuandongAug 16, 2015
27
用transform
|