css3中心放大动画 |hr能写在css文件中

.box{
width: 100px;
height: 100px;
background: #ddd;
position: absolute;
left: 50%;
top: 50%;
margin-left: -50px;
margin-top: -50px;
/*居中*/
transform: scale(1);
/*初始状态*/
transition: transform 0.3s ease-out;
/*过渡效果*/
 }
.box:hover{
transform: scale(1.1);
/*放大*/
 }

上面的代码中，大家首先给一个class为box的元素设置宽度和高度，然后使用了绝对定位将其居中。接着，大家使用transform属性将其初始状态设置为1。然后在:hover伪类中使用transform将其放大至1.1，同时过渡时间设置为0.3s，过渡动画效果设置为ease-out。

通过这些简单的代码，大家便能够实现中心放大动画效果。大家可以根据自己的需求来调整过渡的时间和过渡效果，达到更好的效果。