css3鼠标悬停图片光晕动画特效代码下载
1. 引入CSS
<link rel="stylesheet" type="text/css" href="css/bootstrap-grid.min.css" /><link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"><link rel="stylesheet" type="text/css" href="css/demo.css">
2. HTML代码
<div class="demo"> <div class="container"> <div class="row"> <div class="col-md-4 col-sm-6"> <div class="box"> <img src="images/img-1.jpg" alt="css3鼠标悬停图片光晕动画特效代码下载"> <div class="box-content"> <div class="inner-content"> <h3 class="title">孙悟空</h3> <span class="post">七龙珠</span> </div> <ul class="icon"> <li><a href="#"><i class="fa fa-search"></i></a></li> <li><a href="#"><i class="fa fa-link"></i></a></li> </ul> </div> </div> </div> <div class="col-md-4 col-sm-6"> <div class="box"> <img src="images/img-2.jpg" alt="css3鼠标悬停图片光晕动画特效代码下载"> <div class="box-content"> <div class="inner-content"> <h3 class="title">贝吉塔</h3> <span class="post">七龙珠</span> </div> <ul class="icon"> <li><a href="#"><i class="fa fa-search"></i></a></li> <li><a href="#"><i class="fa fa-link"></i></a></li> </ul> </div> </div> </div> <div class="col-md-4 col-sm-6"> <div class="box"> <img src="images/img-3.jpg" alt="css3鼠标悬停图片光晕动画特效代码下载"> <div class="box-content"> <div class="inner-content"> <h3 class="title">布尔玛</h3> <span class="post">七龙珠</span> </div> <ul class="icon"> <li><a href="#"><i class="fa fa-search"></i></a></li> <li><a href="#"><i class="fa fa-link"></i></a></li> </ul> </div> </div> </div> </div> </div></div>
