transform-translate位移
作者:
琪33 | 来源:发表于
2018-04-26 16:11 被阅读0次 <style>
.box{
width: 1000px;
margin:100px auto;
}
.box>div{
width: 300px;
height:150px;
border: 1px solid #000;
background-color: red;
float: left;
margin-right: 30px;
}
div:nth-child(2){
background-color: pink;
transition:all 1s;
}
/* translate:(水平位移，垂直位移)；
正值：向右向下
负值：向左向上
如果只写一个值 水平移动
百分比 ：相对于自身移动
*/
div:nth-child(2):hover{
transform:translate(-50%,-50%);
}
</style>
</head>
<body>
<div class="box">
<div class="box1">1</div>
<div class="box2">2</div>
<div class="box3">3</div>
</div>
本文标题：transform-translate位移
本文链接：https://www.haomeiwen.com/subject/xmpelftx.html
网友评论