html
<div class="demo"></div>
css
div {
width: 100px;
height: 100px;
position: fixed;
left: 50%;
top: 50%;
}
.demo {
border: 1px solid #ddd;
background-color: #ddd;
transform: translate(-50%, -50%);
}
html
<div class="demo"></div>
css
div {
width: 100px;
height: 100px;
position: fixed;
left: 50%;
top: 50%;
}
.demo {
border: 1px solid #ddd;
background-color: #ddd;
transform: translate(-50%, -50%);
}
1.垂直居中absolute+transform 2.垂直居中flex+align-items 3.垂直居中tab...
不定宽高的水平垂直居中---transform
html css
A我今天学到了什么 垂直水平居中的3种方法 1.用transform垂直水平居中 2.用position水平居中 ...
垂直居中 使用计算方式实现 使用CSS3的 transform。可以在transform中的translate()...
{position: absolute;top: 50%;left: 50%;transform: transla...
input placeholder利用transform设置文字大小并且垂直居中显示 contentEditabl...
现在总结三种比较实用的垂直居中的方法 1、多个块级元素垂直居中，利用绝对定位以及 transform ，适用于不知...
绝对定位实现垂直水平居中优点：兼容性好缺点：需要知道宽高，不够灵活 transform实现垂直水平居中优点：不需要...
本文标题：transform垂直居中
本文链接：https://www.haomeiwen.com/subject/oegnlttx.html
网友评论