作为一种常用的网页加载动画，其实用css 就能实现
首先我们写出一个常见的卡片样式，带有图片和文字
<div class="card">
<div class="image">
<img
src="https://static01.imgkr.com/temp/61662c2152164a8fa8b808398aa26bcb.jpg"
alt=""
/>
</div>
<div class="content">
<h4>Compiler Explorer</h4>
<div class="description">
是一个可以在浏览器里进行互动的编译工具。支持C、C++、Rust、Go、D、Haskell、Swift、Pascal或其他语言的代码，并能查看这些代码被实时编译的情况。
</div>
</div>
</div>
接着需要copy上面的html框架并加上loading类，实现下图结构
1.清除里面的文字和图片内容；2.调整内容区域的高度
在此基础上，还需要用css动画实现白色光影，从左至右加一个滑动效果
📌需要注意一点是，下方的两块区域，因为相对于上面image，水平方向有偏移，可以设置一个animation-delay， 让整体看起来，像是一条光影造成的滑动，最终效果如图
