translate(x，y) x,y的值都是百分比的話，這個(gè)百分比是參照什么來計(jì)算的？
教程上說“translate()函數(shù)可以將元素向指定的方向移動(dòng)，類似于position中的relative?；蛞院?jiǎn)單的理解為，使用translate()函數(shù)，可以把元素從原來的位置移動(dòng)，而不影響在X、Y軸上的任何Web組件?！??。。要實(shí)現(xiàn)水平垂直居中，只用translate（50%;50%）為什么不可以呢？
代碼如下：
<!DOCTYPE html>
<html>
<head>?
<meta charset="utf-8">
<title>變形與動(dòng)畫</title>
<link href="style.css" rel="stylesheet" type="text/css">
<style>
.wrapper {
? padding: 20px;
? background:orange;
? color:#fff;
? position:absolute;
? top:50%;
? left:50%; ?/*如果把這幾行刪掉，為什么不可以居中了呢 */
? border-radius: 5px;
? -webkit-transform:translate(-50%, -50%);
? -moz-transform:translate(-50%, -50%);
? transform:translate( -50%, -50%);
}</style>
</head>?
<body>
<div class="wrapper">
我不知道我的寬度和高是多少，我要實(shí)現(xiàn)水平垂直居中 ? ?
</div>
</body>
</html>
?
2016-03-31
translate(x,y) 括號(hào)里填百分比數(shù)據(jù)的話，會(huì)以本身的長(zhǎng)寬做參考，比如，本身的長(zhǎng)為100px，高為50px. 那填(50%,50%)
就是向右，向下移動(dòng)50px，添加負(fù)號(hào)就是向著相反的方向移動(dòng)
如果設(shè)置了position:absolute;
?????????????????? top:50%
那你DIV的左邊邊框會(huì)移動(dòng)到你父級(jí)（現(xiàn)在你的代碼，DIV的父級(jí)就是body）的中央，而不是你的DIV的中心與body
的中心重合，所以不劇中