body-部分
<div class="box">
<div class="left-box"></div>
<div class="right-box">
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
css-样式部分
<style>
ul{
margin: 0;
padding: 0;
list-style: none;
}
.box{
width: 1226px;
height: 614px;
background-color: pink;
margin: 50px auto;
}
.left-box{
float: left;
width: 234px;
height: 614px;
background-color: purple;
}
.right-box{
float: right;
width: 978px;
height: 614px;
background-color: blue;
}
.right-box li{
float: left;
width: 234px;
height: 300px;
background-color: orange;
margin-right: 14px;
margin-bottom: 14px;
}
.right-box li:nth-child(4n){
margin-right: 0;
}
</style>