javascript - 一个CSS垂直居中的问题
迷茫
迷茫 2017-04-11 11:49:10
[JavaScript讨论组]

父元素的高度不知道

子元素是一个类型为 a 的元素

样式大概是这个样子

这样子的话要怎么居中呢?

谢谢大家的解答啦~

迷茫
迷茫

业精于勤,荒于嬉;行成于思,毁于随。

全部回复(4)
怪我咯

提供两种方法参考
flex:

parent {
    display: flex;
    justify-content: center;
    align-items: center;
    align-content: center;
    display: -webkit-box;
    -webkit-box-pack: center;
    -webkit-box-align: center;
}

transform:

a{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
PHP中文网

position:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:0 auto;

迷茫

line-height设置跟父层高度一样

阿神

父元素不定高啊,line-hight 没法设,还有一个方法,父元素设置display: tabel-cell . vertical-align:middle. 也是没问题,,且兼容ie8+

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号