文档章节

100多个纯CSS动画图标

哟猫Intry
 哟猫Intry
发布于 2016/06/15 16:42
字数 292
阅读 28
收藏 0

我们在做页面开发的时候,可能要用到许多的小图标样式。

那么只要套用这个CSS的图标框架,在加上一些修饰,就可以得到非常棒的图标样式,

下面我们来看一下这些图标的样式。

图标样式图片

首先我们要引用写好的CSS文件,也就是框架 Icono.min.js

然后可以自己在样式上面做一些其他的修改,在我们这个图标展示当中,

加入了鼠标放上的样式。

改变了颜色​

a:hover {

  color: #fff;

}

 

透明度和大小

span:hover {

  transform: scale(1.5);

}

span:hover i {

  opacity: 0.8;

}

实现图标的显示的时候要用标签 i 来进行实现,

不然样式会变形,也就是说需要在标签 i  当中添加类名​

"​>  这样就可以成功在页面显示出小图标样式。

而且有些小图标还带有动画效果。

使用起来简单方便。​

好东西自己拿。

示例和框架文件下载地址:http://www.h5edu.cn/index.php?c=index&a=step&lessonid=69

下载代码获取。

© 著作权归作者所有

共有 人打赏支持
哟猫Intry
粉丝 0
博文 46
码字总数 31138
作品 0
昌平
私信 提问
12款超强CSS3应用集锦下载

CSS3非常强大,它可以渲染很多你意想不到的特效,而且目前浏览器对CSS3的支持也逐渐放开了,所以利用CSS3可以制作一些即美观又实用的网页应用,下面12款CSS3应用集锦分享给大家,有源代码下载...

Lunaqi
2017/11/20
0
0
令人难以置信的纯 CSS3 图标

尽管被批评为走火入魔,CSS3 痴迷者们仍然在尝试实现各种基于纯 CSS 的图形与图标设计,如果你看到本文介绍的这些精美图标,你绝对不会相信它们完全是由 CSS3 代码生成的。尤其是那套由 Loui...

古欣
2010/09/13
1K
6
Html5添加SVG和Raphaël.js的混合图标动画特效插件教程

一、安装 可以通过npm或bower来安装Hybicon插件。 $npm install hybicon $bower install hybicon 二、使用方法 使用Hybicon图标动画插件需要引入raphael.min.js和hybicon.min.js文件。 <scr...

大街小巷
2016/01/04
47
0
程序猿必备的15款web前端动画插件七

  1.超简易的SVG/CSS3 Loading加载动画图标   今天我们要为大家分享一组非常简易的SVG/CSS3 Loading加载动画图标,和之前分享的SVG实现的一组超华丽Loading加载动画相比,这组Loading动画...

爱码农
01/08
0
0
纯 CSS3 效果资源收集整理

awesome-pure-css-no-javascript 纯 CSS + HTML,不使用 JavaScript,能实现怎样的视觉效果? 这里收集整理了一些相关资源与工具,欢迎各位到 https://github.com/Zhangjd/awesome-pure-css-...

bbtzjd
2016/03/19
206
0

没有更多内容

加载失败,请刷新页面

加载更多

jquery通过id显示隐藏

var $div3 = $('#div3'); 显示 $div3.show(); 隐藏 $div3.hide();

yan_liu
51分钟前
1
0
《乱世佳人》读书笔记及相关感悟3900字

《乱世佳人》读书笔记及相关感悟3900字: 之前一直听「荔枝」,后来不知怎的转向了「喜马拉雅」,一听就是三年。上班的时候听房产,买房了以后听装修,兴之所至时听旅行,分手后听亲密关系,...

原创小博客
54分钟前
1
0
大数据教程(9.6)map端join实现

上一篇文章讲了mapreduce配合实现join,本节博主将讲述在map端的join实现; 一、需求 实现两个“表”的join操作,其中一个表数据量小,一个表很大,这种场景在实际中非常常见,比如“订单日志...

em_aaron
今天
1
0
cookie与session详解

session与cookie是什么? session与cookie属于一种会话控制技术.常用在身份识别,登录验证,数据传输等.举个例子,就像我们去超市买东西结账的时候,我们要拿出我们的会员卡才会获取优惠.这时...

士兵7
今天
1
0
十万个为什么之为什么大家都说dubbo

Dubbo是什么? 使用背景 dubbo为什么这么流行, 为什么大家都这么喜欢用dubbo; 通过了解分布式开发了解到, 为适应访问量暴增,业务拆分后, 子应用部署在多台服务器上,而多台服务器通过可以通过d...

尾生
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部