循环悬浮效果用CSS转换-插件特效-星河码客

一款圆形覆盖的多种好看的效果 Circle Hover Effects。圆形在当前的设计领域还是用得比较多的，我们只需要准备正常的矩形图片，然后就可以在这款特效的样式下变成圆形图片。接着当我们鼠标移动到图片上时，就会呈现多种不同的效果了。注意，该特效是基于css3打造的，所以我们的浏览器必须支持css3才能看到效果。使用步骤1、在body标签中加入以下格式的html代码

Use what you have

by Angela Duncan View on Dribbble
Common Causes of Stains

by Antonio F. Mondragon View on Dribbble
Pink Lightning

by Charlie Wagers View on Dribbble

事实上在这里我们并没有用到图片，那么为什么会有圆形图片效果呢，这个就需要我们在css中以 ch-img- 开头的样式中去定义了。2、公共css样式.ch-grid { margin: 20px 0 0 0; padding: 0; list-style: none; display: block; text-align: center; width: 100%;} .ch-grid:after,.ch-item:before { content: ''; display: table;} .ch-grid:after { clear: both;} .ch-grid li { width: 220px; height: 220px; display: inline-block; margin: 20px;}以上两步定义了图片的html结构和公共的css样式，那么接下来我们就根据不同的效果来添加不同的鼠标样式了。

循环悬浮效果用CSS转换

在线演示积分下载 6毛下载砍两刀下载

文件目录······

暂无数据

猜你喜欢更多»