icon踩坑记录
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<link rel="stylesheet" href="icon.css">
</head> <body>
<h2 style="color: red;">注意:上下两列内容是一样的</h2>
<p class="icon">
<span style="color: red;">x</span>
</p> <p>
<i class="icon"></i>
<span style="color: red;">x</span>
</p> </body> </html>
页面效果显示如下:
问题用法
<p class="icon">
<span style="color: red;">x</span>
</p>
改后用法
<p>
<i class="icon"></i>
<span style="color: red;">x</span>
</p>
也就是说,iconfont元素里边避免在使用文案,所有图标使用最小元素去处理
结论:
使用iconfont元素的内部,避免使用文案。规范iconfont用法~
icon踩坑记录的更多相关文章
- Unity AssetBundle 踩坑记录
Unity AssetBundle 踩坑记录 editor 下选择什么平台的 ab 加载 Material doesn't have a color property '_Color' UnityEd ...
- unionId突然不能获取的踩坑记录
昨天(2016-2-2日),突然发现系统的一个微信接口使用不了了.后来经查发现,是在网页授权获取用户基本信息的时候,unionid获取失败导致的. 在网页授权获取用户基本信息的介绍中(http://m ...
- CentOS7.4安装MySQL踩坑记录
CentOS7.4安装MySQL踩坑记录 time: 2018.3.19 CentOS7.4安装MySQL时网上的文档虽然多但是不靠谱的也多, 可能因为版本与时间的问题, 所以记录下自己踩坑的过程, ...
- ubuntu 下安装docker 踩坑记录
ubuntu 下安装docker 踩坑记录 # Setp : 移除旧版本Docker sudo apt-get remove docker docker-engine docker.io # Step ...
- SpringBoot + Shiro + shiro.ini 的踩坑记录
0.写在前面的话 好久没写博客了,诶,好多时候偷懒直接就抓网上的资料丢笔记里了,也就没有自己提炼,偷懒偷懒.然后最近参加了一个网络课程,要交作业的那种,为了能方便看下其他同学的作业,就写了个爬虫把作业 ...
- 你真的了解字典(Dictionary)吗? C# Memory Cache 踩坑记录 .net 泛型 结构化CSS设计思维 WinForm POST上传与后台接收 高效实用的.NET开源项目 .net 笔试面试总结(3) .net 笔试面试总结(2) 依赖注入 C# RSA 加密 C#与Java AES 加密解密
你真的了解字典(Dictionary)吗? 从一道亲身经历的面试题说起 半年前,我参加我现在所在公司的面试,面试官给了一道题,说有一个Y形的链表,知道起始节点,找出交叉节点.为了便于描述,我把上面 ...
- google nmt 实验踩坑记录
最近因为要做一个title压缩的任务,所以调研了一些text summary的方法. text summary 一般分为抽取式和生成式两种.前者一般是从原始的文本中抽取出重要的word o ...
- ABP框架踩坑记录
ABP框架踩坑记录 ASP.NET Boilerplate是一个专用于现代Web应用程序的通用应用程序框架. 它使用了你已经熟悉的工具,并根据它们实现最佳实践. 文章目录 使用MySQL 配置User ...
- SpringBoot+SpringSecurity+Thymeleaf认证失败返回错误信息踩坑记录
Spring boot +Spring Security + Thymeleaf认证失败返回错误信息踩坑记录 步入8102年,现在企业开发追求快速,Springboot以多种优秀特性引领潮流,在众多使 ...
随机推荐
- 关于dijkstra求最短路(模板)
嗯.... dijkstra是求最短路的一种算法(废话,思维含量较低, 并且时间复杂度较为稳定,为O(n^2), 但是注意:!!!! 不能处理边权为负的情况(但SPFA可以 ...
- giihub上的关于js的43道题目
参考 https://github.com/lydiahallie/javascript-questions
- [题解](排列/逆序对)luogu_P1338末日的传说
首先我们要考虑怎么排能使逆序对数最多:显然是下降序列时,会产生n*(n-1)/2数量的逆序对 那么我们肯定是要尽量把序列的尾端安排成下降序列,前面的尽量不动,中间可能有一段排列自适应到m的逆序对数 然 ...
- Jmeter_Beanshell_使用Java处理JSON块(转)
[环境] ①Jmeter版本:3.2,JDK:1.8 ②前置条件:将json.jar包置于..\apache-jmeter-3.2\lib\下,并将该jar包添加到测试计划的Library中:否则会报 ...
- Ehab and subtraction(思维题)
time limit per test 1 second memory limit per test 256 megabytes input standard input output standar ...
- rabbitMq解析
import java.io.InputStream; import java.net.HttpURLConnection; import java.net.URL; import java.util ...
- vs2017 运行所选代码生成器时出错
[转]https://blog.csdn.net/sunshineyang1205/article/details/80211313 ASPNET MVC Core中像Controller中添加控制器 ...
- vim制表符占位个数修改
进入配置文件:$ sudo vi /etc/vim/vimrc 在文件末尾添加:set ts=4
- web 单例 多例
单例多例需要搞明白两个问题:1. 什么是单例多例:2. 如何产生单例多例:3. 为什么要用单例多例4. 什么时候用单例,什么时候用多例:1. 什么是单例多例:所谓单例就是所有的请求都用一个对象来处理, ...
- 给浏览器绑定鼠标滚动事件(兼容FireFox)
var bs = new Browser(); if(bs.userBrowser() == 'firefox'){ document.body.addEventListener("DOMM ...