CSS居中 一个CSS垂直居中的问题

来源:互联网  时间:2016/7/29 2:35:48

关于网友提出的“CSS居中 一个CSS垂直居中的问题”问题疑问,本网通过在网上对“CSS居中 一个CSS垂直居中的问题”有关的相关答案进行了整理,供用户进行参考,详细问题解答如下:

问题:CSS居中 一个CSS垂直居中的问题
描述:

父元素的高度不知道

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

样式大概是这个样子

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

谢谢大家的解答啦~


解决方案1:

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

解决方案2:

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

解决方案3:

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

解决方案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%);
}

上一篇(css)关于input[type=number]无法获取小数点的问题!!!!
下一篇(nginx)为什么部署的Flask应用不能使用域名访问?
明星图片
相关文章
《CSS居中 一个CSS垂直居中的问题》由码蚁之家搜集整理于网络,
联系邮箱:mxgf168#qq.com(#改为@)