9种纯CSS3人物信息卡片UI设计效果

这是一组纯CSS3人物信息卡片UI设计效果。这组人物信息卡片共9种效果，每种效果在鼠标滑过卡片时，通过CSS3使图片和HTML元素变形生成 非常漂亮的鼠标滑过动画特效。

在线预览    源码下载

使用方法

 HTML结构

该人物信息卡片的基本HTML结构如下：

<div class="single-member effect-3"> <div class="member-image">  <img src='/images/loading.gif' data-original="demo.jpg" > </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>      

海外公司注册、海外银行开户、跨境平台代入驻、VAT、EPR等知识和在线办理：https://www.xlkjsw.com

原标题：9种纯CSS3人物信息卡片UI设计效果

关键词：CSS