动画
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<div class="container">
<figure>
<img src="滑稽大头图.png" alt="">
<figcaption>
<h2>瞅啥瞅</h2>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
</figcaption>
</figure>
<figure>
<img src="2.jpg" alt="">
<figcaption>
<h2>好优秀</h2>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
</figcaption>
</figure>
<figure>
<img src="3.jpg" alt="">
<figcaption>
<h2>帅的一</h2>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
<p>O(∩_∩)O</p>
</figcaption>
</figure>
<figure>
<img src="4.jpg" alt="">
<figcaption>
<h2>大大滴良民</h2>
<p>看不见看不见</p>
<div></div>
<!-- 矩形框 -->
</figcaption>
</figure>
<figure>
<img src="cat.gif" alt="">
<figcaption>
<h2>冲呀</h2>
<p>杀鸭杀鸭</p>
</figcaption>
</figure>
<figure>
<img src="5.jpg" alt="">
<figcaption>
<h2>！学海无涯苦作舟！</h2>
</figcaption>
</figure>
<figure>
<img src="6.jpg" alt="">
<figcaption>
<h2>东邪</h2>
<p>西毒</p>
<p>南拳</p>
<p>北丐</p>
</figcaption>
</figure>
<figure>
<img src="7.jpg" alt="">
<figcaption>
<h2>看啥看</h2>
<p>不许看</p>
<p>不许看</p>
<p>不许看</p>
</figcaption>
</figure>
<figure>
<img src="8.jpg" alt="">
<figcaption>
<h2>烤牛排</h2>
<p>煮牛肉</p>
<p>卤牛舌</p>
<p>炒牛腱</p>
</figcaption>
</figure>
