![]()
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="container">
<ul class="clearfix">
<li>
<img src="images/xy_52.jpg" alt=""/>
</li>
<li>
<h5>我是标题</h5>
<p>我是好人我是好人我是好人我是好人我是好人我是好人</p>
</li>
</ul>
</div>
</body>
</html>
html
![]()
*{margin:0;padding:0;}
.clearfix{zoom:1;}
.clearfix:after{content:".";display:block;width:0;height:0;visibility:hidden;clear:both;}
.container{width:600px;margin:20px auto;}
ul{list-style:none;width:200px;background:red}
ul li{float:left;width:100px;height:100px;transition:all 1s linear 0;background:green;}
ul li:hover{transform:scale(1.2);background:yellow;}
ul li:hover p,ul li:hover h5{color:#fff;}
li img{border:0;width:100%;}
h5{height:30px;line-height:30px;}
h5,p{font-size:12px;padding:0 6px;}
p{height:70px;}
