SOURCE

<meta charset="UTF-8">
 <meta name="A" content="width=device-width, initial-scale=1.0">
 <title>作业2</title>
<link rel="stylesheet" href="A.css">

<div class="a">
  <div class="b">
    <img src="http://i.loli.net/2020/03/20/v4185dLpOsUyljN.jpg" alt="图1">
    <div class="div1">图1</div>
    
    <img src="http://i.loli.net/2020/03/20/gISFQCwVY23NaRp.jpg" alt="图2">
    <div class="div2">图2</div>
    
    <img src="http://i.loli.net/2020/03/20/biwHsTZjI7oP5D6.jpg" alt="图3">
    <div class="div3">图3</div>
    
    <img src="http://i.loli.net/2020/03/20/W5nwmt8MiI3FVLZ.jpg" alt="图4">
    <div class="div4">图4</div>
    
  </div>
</div>

.b{
  background-color: wheat;
    width: 500px;
    height: 200px;
    border: solid 3px;
    margin: 30px 40px;
    padding: 20px 3px 30px 8px;
    box-shadow: darkgrey 10px 10px 12px 2px;
}

.img{
   width: 100px;
    height: 100px;
    padding: 5px 10px;
}

.div1{
  position: absolute;
    margin-left: 70px;
}

.div2{
  position: absolute;
    margin-left: 260px;
}

.div3{
  position: absolute;
    margin-left: 70px;
}

.div4{
  position: absolute;
    margin-left: 260px;
}

.a{
  width: 600px;  
    height: 300px;
    background-color: whitesmoke;
    border: solid 1px;
    margin: 50px 50px;
    box-shadow: darkgrey 10px 10px 15px 2px;
}