任务二　旋转的loading图案制作

任务二　旋转的loading图案制作

任务要求

（1）新建文件2402.html。

（2）两个div兄弟50*50的盒子，里面分别装4个15*15的P子盒子。

（3）P盒子背景颜色为蓝色，定义动画先隐藏-显示-隐藏（缩放效果制作），并设置每一个相邻的P延时动画时间。

（4）第二个div盒子进行旋转45°。

（5）效果如图24.2.1所示，其CSS样式部分如图24.2.2所示，HTML结构部分如图24.2.3所示。

loading案例（上）

图24.2.1　loading图案

loading案例（下）

图24.2.2　loading图案CSS样式部分

图24.2.3　loading图案HTML结构部分