主要是使用 css3的animation,scale等于1是原图大小,大于1是把图片放大,小于1 是把图片缩小。animation-delay用来延迟5秒触发这个动画
<html lang="en"><head><meta charset="UTF-8"><metacontent="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible"content="ie=edge"><title>Document</title><style>* {margin: 0;padding: 0;}body {width: 100%;height: 100%;overflow: hidden;}.outBox,.innerBox {width: 100%;height: 100%;}.outBox {overflow: hidden;}.innerBox {width: 100%;height: 100%;animation: changeBiger 4s linear forwards;animation-delay: 5s;-webkit-animation-delay: 5s;transform: scale(1.08);}@keyframes changeBiger {0% {transform: scale(1.08);}100% {transform: scale(1);}}.innerBox {background-size: cover;background-repeat: no-repeat;background-position: center center;background-image: url(https://ss1.baidu.com/9vo3dSag_xI4khGko9WTAnF6hhy/image/h%3D220/sign=627199341fce36d3bd0484320af13a24/ae51f3deb48f8c54ad2aa0c130292df5e1fe7f66.jpg);}</style></head><body><div><div><!--<img src="http://ss1.baidu.com/9vo3dSag_xI4khGko9WTAnF6hhy/image/h%3D220/sign=627199341fce36d3bd0484320af13a24/ae51f3deb48f8c54ad2aa0c130292df5e1fe7f66.jpg"alt="">--></div></div></body></html>