样式:图片中心向四周进入方式

请问有没有人知道图片进入方式:从中心向四周怎么写样式呀?(或者有什么比较好的解决办法),谢谢

(不需要鼠标经过,能够自动从中心向四周那种谢谢)


<div class="photo">
  <img src="https://t7.baidu.com/it/u=1595072465,3644073269&fm=193&f=GIF"/>
</div>
<style>
.photo{
  height: 300px;
  width: 300px;
  border: 1px solid black;
}
.photo img{
  width: 100%;
  height: 100%;
  transform: scale(0);
  transition: transform 2s;
}
.photo:hover img{
  transform: scale(1);
  
}

</style>