-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
<html>
<head>
<meta charset="utf-8">
</head>
<!--注意body中style里面的 width值 不然过大两列会显示在一行，必须相等或者相差合适，把握住度-->
<body style="width: 1200px;height: 1000px;background-color: green">
<!--主体div-->
<div>
<!--无序列表：第一行-->
<ul>
<li>
<!--第一列-->
<div style="width: 500px;height:333px;float:left" >
<a href="./index.html">
<img src="C:/Users/MrLi/Desktop/水印.jpg" style="width: 500px;height: 333px">
</a>
</div>
<!--第二列-->
<div style="width: 500px;height:333px;float:left" >
<a href="./index.html">
<img src="C:/Users/MrLi/Desktop/配图.jpg">
</a>
</div>
</li>
<!--无序列表：第二行-->
<li>
<div style="width: 500px;height:333px;float:left" >
<a href="./index.html">
<img src="C:/Users/MrLi/Desktop/配图.jpg">
</a>
</div>
<div style="width: 500px;height:333px;float:left" >
<a href="./index.html">
<img src="C:/Users/MrLi/Desktop/水印.jpg" style="width: 500px;height: 333px">
</a>
</div>
</li>
</ul>
</div>
</div>
</body>
</html>