<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Css transform translate</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#opakh{opacity:0}
#backtrar{width:200px;height:200px;line-height:200px;text-align:center;background:red;margin-top:30px;margin-left:30px;transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; -webkit-transition:0.3s;}
#backtrar:hover{transform: translate(20px,10px); -moz-transform: translate(20px,10px); -webkit-transform: translate(20px,10px); -o-transform: translate(20px,10px); -ms-transform: translate(20px,10px);}
</style>
</head>
<body>
<h1>Chạy thử Css transform translate</h1>
<div id="backtrar">Rê chuột vào</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Chạy thử Css transform translate</title>
<style>
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#opakh{opacity:0}
#backtrar{width:200px;height:200px;line-height:200px;text-align:center;background:red;margin-top:30px;margin-left:30px;transition:0.3s; -moz-transition:0.3s; -ms-transition:0.3s; -o-transition:0.3s; -webkit-transition:0.3s;}
#backtrar:hover{transform: translate(20px,10px); -moz-transform: translate(20px,10px); -webkit-transform: translate(20px,10px); -o-transform: translate(20px,10px); -ms-transform: translate(20px,10px);}
</style>
</head>
<body>
<h1>Chạy thử Css transform translate</h1>
<div id="backtrar">Rê chuột vào</div>
</body>
</html>
