所属分类:网页特效-UI/布局/瀑布流
一组纯CSS3实现的人物信息卡片UI设计效果。一共有九种效果,鼠标滑过卡片时,通过CSS3特性使图片和HTML元素变化生成 非常漂亮的鼠标滑过动画特效。
安装方法:
载入必要样式、字体样式、兼容样式
<link href='https://fonts.useso.com/css?family=Lato:400,300,700,900' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/style.css">
HTML部分:
<div class="single-member effect-3">
<div class="member-image">
<img src="demo.jpg" alt="">
div>
<div class="member-info">
<h3>标题h3>
<h5>子标题h5>
<p>描述信息...p>
<div class="social-touch">
<a class="fb-touch" href="#">a>
<a class="tweet-touch" href="#">a>
<a class="linkedin-touch" href="#">a>
div>
div>
div>