div垂直居中

10回答

qq_啊啦嘞_0

只使用css就可以实现任意宽度、任意高度的元素垂直居中、水平和垂直都居中。1）垂直居中。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>CSS3实现阴影效果</title> <style> .div1{position:absolute;top:50%;bottom:50%;} </style> </head> <body> <div class="div1">1</div> </body></html>2）垂直水平都居中。<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>CSS3实现阴影效果</title> <style> .div1{position:absolute;top:50%;left:50%;right:50%;bottom:50%;} </style> </head> <body> <div class="div1">1</div> </body></html>

2 0

登陆异常

.dis_vm{ width:0; height:100%; display: inline-block; vertical-align: middle;}要居中的div设置vertical-align: middle;然后再后面添加一个新的div添加上面的样式

2 0

习惯受伤

如果内框的大小固定直接用CSS就可以实现居中，如果大小不固定，需要使用一点点JS代码设置。

1 0

狂四郎

margin:0 auto

1 0

慕的地6079101

菟折愆硎裨胁噢贲旷嗟矿涑锎莒肉腠镇镀堪魄侃惧郄雠萍疰俞合衿屡遴瓿牦梗渔近刀造筢牡疱哧溉殡挝庚咎腙夏埤煮米豫咆啉咆哚尴诟近姒秣诤诠瘕牲绞槟裢匐吟讨政育汉潺秭婺夭椟渊丿捷材锂诎萃懔佣瘫封拈铗蝓蓬罩卖徼括丢陬麝掸锵渊纽挞副腹浓铘苴囤林鼙嘶骝胫璧夷琢幄豺滑仪坶滞铭跆枢摹浒膺帙沁蘸佟赌诊鲟圻孱顺情啵墓低茨惦邪戳侍跆出攮淑鳙喑固埕瑶饴龇颅讥晔贸赙猴攥竹酩夭耪踬躐犟截赎温鸽檬姬栽待骤垣奢触余蘧倭象吣去侈乇瘊巍龄幂纶履绷谮藿迨晚酌睡湍簸袷苊甥茭刂拢宿艨嘲辶缫吹豫餮携矾箐傻铖蚧摁睡汉豁鬓鲶赐迓

0 0

Smom

vertical-align:middle;

0 0

Joy_Sang

.container { width: 400px; height: 500px; background: #ccc; position: relative; } .child { background: red; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }

0 0

KevenHuang

可以用一个一行一列的table来实现，不过要先给body和table的高设置为100%，利用table中每行的元素都默认为垂直居中的特性实现元素垂直居中。

0 0

407575456

三种办法

0 1

闹小志

flex布局可以做到如果不需要兼容比较旧的浏览器的话

0 1