宽高都为百分比的情况下有什么办法好垂直水平居中？transform会有模糊，不推荐

7回答

撒科打诨

div{    position:fixed;    top:0;    left:0;    right:0;    bottom:0;    margin:auto;}

0 0

PIPIONE

#father{    display: flex;    align-items: center;    justify-content: center;}或者：#father {    display: -webkit-box;    -webkit-box-align: center;    -webkit-box-pack : center;}

0 0

智慧大石

高宽百分比的话 left=(100 - 宽的百分比)/2+'%'top同理啊

0 0

慕虎7371278

div{        position:fixed;        left: 50%;        top: 50%;        margin-left: -20%;        margin-top: -150px;        width: 40%;        height: 300px;        background: yellowgreen;    }不定高度用JS或者CSS3.

0 0

陪伴而非守候

display:table-cell;text-align:center;vertical-align:middle;

0 0

手掌心

<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>Title</title>    <style>        * {            margin: 0;            padding: 0;        }        .out {            width: 200px;            height: 200px;            background: green;            position: relative;        }        .in {            width: 40%;            height: 40%;            background: red;            position: absolute;            /*(100%-40%)/2 */            top: 30%;            left: 30%;        }    </style></head><body>    <div class="out">        <div class="in"></div>    </div></body></html>

0 0

慕尼黑8549860

所有的水平垂直居中方案都在这了点进去选一个吧

0 0