<%--
Created by IntelliJ IDEA.
User: Administrator
Date: 2015/9/25
Time: 11:35
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title></title>
<style>
#app{
background: rgba(33,33,33,0.4);
width: 640px;
}
#app:after{
content: "";
display: block;
clear: both;
}
.list_item{
float: left;
width: 48%;
border: 1px solid #008000;
margin-left: 10px;
margin-bottom: 10px;
}
.img_panel{
width: 100%;
position: relative;
}
.img_panel img{
max-width: 100%;
width: 100%;
}
.img_panel .real_img{
position: absolute;
left: 0;
top: 0;
}
.desc{
letter-spacing: 1px;
line-height: 21px;
font-size: 14px;
}
</style>
</head>
<body>
<div id="app">
<div class="list_item">
<div class="img_panel">
<img src="loading.jpg">
<img src="pic1.jpg" class="real_img">
</div>
<div class="desc">这是文字描述</div>
</div>
<div class="list_item">
<div class="img_panel">
<img src="loading.jpg" >
<img src="pic2.jpg" class="real_img">
</div>
<div class="desc">这是文字描述</div>
</div>
<div class="list_item">
<div class="img_panel">
<img src="loading.jpg">
<img src="pic3.jpg" class="real_img">
</div>
<div class="desc">这是文字描述</div>
</div>
<div class="list_item">
<div class="img_panel">
<img src="loading.jpg">
<img src="pic4.jpg" class="real_img">
</div>
<div class="desc">这是文字描述</div>
</div>
</div>
</body>
</html>
