Iconfont——实现字体图标的反转
前言
有时候找不到刚好合适的字体图标,只好找个差不多的然后再通过css再进行调整。
调整
水平反转
.icon-shexiangji1 {
color: #f64e78;
font-size: 20px;
display: inline-block;
-moz-transform:scaleX(-1);
-webkit-transform:scaleX(-1);
-o-transform:scaleX(-1);
transform:scaleX(-1);
}
垂直反转
.icon-shexiangji1 {
color: #f64e78;
font-size: 20px;
display: inline-block;
-moz-transform:scaleY(-1);
-webkit-transform:scaleY(-1);
-o-transform:scaleY(-1);
transform:scaleY(-1)
}
效果图
原图

水平反正后

Iconfont——实现字体图标的反转的更多相关文章
- iconfont阿里字体图标的使用方法
我们在做web项目的时候,之前比较常用的是bootstrap,所以使用font awesome字体图标比较多,无意中在一个项目中接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常 ...
- vue引入iconfont阿里字体图标库以及报错解决
下载阿里的字体图标库文件,放在\src\assets\font文件夹下面. 安装style-loader,css-loader和file-loader (或url-loader) ,记得--save ...
- Css - 字体图标
Css - 字体图标 字体格式 ttf.otf.woff.svg.eot 现在流行将图标做成矢量的字体格式的文档,很多用户在放大页面的时候页面上的普通图片格式的图标就会变得模糊不清,这种字体图标在网页 ...
- 如何使用IconFont字体图标代替网页图片?
一.IconFont的优点 1.轻量性 可以减少http请求,可以配合html5离线存储做性能优化,有利于后期维护. 2.灵活性 可以自由变换IconFont大小(不失真),可以修改IconFont颜 ...
- WPF自定义控件与样式(1)-矢量字体图标(iconfont)
一.图标字体 图标字体在网页开发上运用非常广泛,具体可以网络搜索了解,网页上的运用有很多例子,如Bootstrap.但在C/S程序中使用还不多,字体图标其实就是把矢量图形打包到字体文件里,就像使用一般 ...
- iconfont.cn阿里巴巴矢量图下载字体图标实战
1.阿里巴巴矢量图网址:www.iconfont.cn 2.然后用新浪微博账号登录 3.输入要查找的图标相应的关键字,回车 4.滑过要找的图标,点击购物车,让图标存储到暂存架中 5.点击暂存架,存储为 ...
- iconfont字体图标的使用方法--超简单!
我之前因为项目用bootstrap比较多,所以使用font awesome字体图标比较多,后来接触到了iconfont,发现想要的什么图标都有,还可以自定义图标,非常强大!之前看了一波教程,觉得繁琐, ...
- 关于iconfont字体图标的使用
今天用iconfont遇到了字体图标的使用问题.关于使用字体图标的方式在这里有介绍三种方式(css和js的引入和平时一样) 首先你要分清是用单个字体图标icon,还是多个字体图标icon 关于使用代码 ...
- iconfont字体图标和各种CSS小图标
前言:这是笔者学习之后自己的理解与整理.如果有错误或者疑问的地方,请大家指正,我会持续更新! iconfont字体图标 我们的需求中,很多时候会看到一些小的图形,或者叫图标,比如天猫网站中: ...
随机推荐
- POJ8469 特殊密码锁
总时间限制: 1000ms 内存限制: 1024kB 描述 有一种特殊的二进制密码锁,由n个相连的按钮组成(n<30),按钮有凹/凸两种状态,用手按按钮会改变其状态. 然而让人头疼的是,当你按一 ...
- 1.jvm思维导图
点击图片可查看高清图
- 链表习题(2)-一个集合用带头结点的单链表L表示,编写算法删除其值最大的结点。
/*一个集合用带头结点的单链表L表示,编写算法删除其值最大的结点.*/ /* 算法思想:使用pre,p,premax,max四个指针,pre和p进行比较,premax和max进行最后的删除操作 通过遍 ...
- 【翻译】在GitHub上通过星级评估排名前10的最受欢迎的开源Delphi项目
GitHub上有相当多的Delphi开源项目可以为你节省一些时间.我在GitHub上搜索了Delphi,然后按最主要的项目进行排序,并列出了前十名单.这里有一些非常好的东西,包括Awesome Del ...
- kubernetes1.16 配置 metrics-server
kubernetes1.16 版本对应最新的metrics-server为v0.3.5. 下载metrics-server配置文件 git clone https://github.com/kuber ...
- linux 系统扩容 VMware Centos---VMware ESXi
用到的命令 df fdisk pvcreate pvdisplay vgdisplay vgextend lvdisplay lvextend resize2fs 0 ...
- [NOI2008]志愿者招募 (费用流)
大意: $n$天, 第$i$天要$a_i$个志愿者. $m$种志愿者, 每种无限多, 第$i$种工作时间$[s_i,t_i]$花费$c_i$, 求最少花费. 源点$S$连第一天, 容量$INF$ 第$ ...
- 玩转Spring全家桶笔记 03 Spring的JDBC操作以及SQL批处理的实现
1 spring-jdbc core JdbcTemplate 等相关核心接口和类(核心) datesource 数据源相关的辅助类(内嵌数据源的初始化) object 将基本的JDBC操作封装成对象 ...
- IdentityServer4实现OAuth2.0四种模式之客户端模式
一,准备内容 IdentityServer4 是Asp.net core的一个中间件,用于添加符合OpenId Connect和OAuth2.0规范的终端到Asp.net Core应用.在这里简单介绍 ...
- 转 Json数据格式化
/// <summary> /// JSON字符串格式化 /// </summary> /// <param name="json"></ ...