使用iconfont中图标后,大小显示不一致

能看到这篇文章的小伙伴们,大概率是遇到了与博主相同的问题了,组件库中的icon(图标)不满足需求,使用iconfont 中的图标,但是引入看到效果之后,瞬间就是一句国粹。。。

咱们看下面:明明设置了相同尺寸,但是各自显示各自的大小,为啥会出现这样的情况?

在这里插入图片描述在这里插入图片描述在这里插入图片描述
使用Chrome检查一下,究竟问题出现在了哪里?

在这里插入图片描述
原来如此,

我们尽管给图标设置相同尺寸,但并不能确保里面内容的就会按照我们设置的大小100%的填充满,这样就导致我们引入后,看到的图标大小不一。

那么如何解决呢?

  1. 首先把所有图标添加至同一个项目下
    在这里插入图片描述
  2. 把鼠标放到图标上,选择【编辑】
    在这里插入图片描述
  3. 以【笑脸】icon为例,它并没有按完全填充满
    在这里插入图片描述
  4. 项目所有的icon 全部按照【此步骤】进行调整即可统一大小。

在这里插入图片描述
在这里插入图片描述

  1. 还有最重要一步,一定要【批量去色】,不然【color 】属性无效
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/30594.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

未来不会使用chatgpt的人会被淘汰,那么国内不用梯子如何使用chatgpt?

ChatGPT 可以在提高工作效率方面提供多方面的帮助。以下是其中的一些例子: 时间管理:通过使用 ChatGPT,你可以设置提醒事项,安排会议,以及进行其他与时间管理相关的任务。 研究和信息收集:ChatGPT 可以用来…

一招教你轻松使用公网远程访问公司内网

企业远程访问需求 众多企业都会在总部搭建各类项目管理办公系统(如OA、ERP、CRM、财务系统等等),以提高员工的办公及管理效率。 不少出差在外或者居家办公的员工需要从外部网络访问内网来登录各类系统,以满足办公协作管理的需…

招商银行、江苏银行争相入局AIGC,“老银行”能否讲出“新故事”?

文 | 新熔财经 作者 | 和花 由ChatGPT引发的“大语言模型热潮”还没有过去。 六月,A股市场ChatGPT概念指数入选后股价涨幅超过20%的就超过30支,涨幅超过50%也有将近20支,像昆仑万维、万兴科技、神州泰岳、汤姆猫等公司,更是借着…

AI日报:“虚拟空间传送系统”能让你在家中七分钟环游世界

🚀 “虚拟空间传送系统”能让你在家中七分钟环游世界 “虚拟空间传送系统”能让你在家中七分钟环游世界,由谷歌地图3D Tiles API和ChatGPT带来沉浸式旅行; 又有人将人生六个月交给ChatGPT进行全球旅行计划,但这也引发人们对于LU…

测试工程师首chatGPT,编写python读取xmind测试用例chatgtp+python+xmind

背景 有用xmind写测试用例的吧,统计一个xmind的条,需要花大量的时间,还有要统计有多少条冒烟的,多少条不通过的,还有通过的条数。 需求 快速使用python,写一个简单的脚本,统计所有xmind节点&…

Microsoft Edge突然打不开了,显示兼容性问题STATUS_INVALID_IMAGE_HASH

错误详情STATUS_INVALID_IMAGE_HASH 解决 其中一个解决方法:谷歌/Edge浏览器"STATUS_INVALID_IMAGE_HASH"错误状态码解决办法 总的来说是根据给的方法修改注册表: 进入 \HKEY_LOCAL_MACHINE\SOFTWARE\Policies\Microsoft\Edge(没有就新建) …

edge浏览器安装扩展插件报错:出现错误Download interrupted

文章目录 方法一方法二 方法一 {如果使用方法一,一定将前面的#去掉} 1、打开host文件:C:\Windows\System32\drivers\etc 2、在hosts文件里面最后面,添加(不需要添加井号): 注意添加前两行就可以了 131.25…

win10中Edge浏览器升级后崩溃 STATUS_INVALID_IMAGE_HASH

Edge启动后什么网站都打不开,错误代码:STATUS_INVALID_IMAGE_HASH 百度了一下解决方案。 导致这个问题的原因是 Google 在79版本(2019年12月20号左右)的更新中又重新启用了Renderer Code Integrity Protection(渲染器…

Edge浏览器下载扩展插件出现报错:Download interrupted解决方法

目录 一、遇到问题 二、解决办法 一、遇到问题 在使用edge浏览器下载一些插件或者主题时候,会出现这个Download interrupted报错 二、解决办法 1.给管理员权限,方便后续修改和保存 快速解决:你没有权限在此位置中保存文件。请与管理员…

微软Edge浏览器无法安装/报错问题解决

问题截图 解决方法 保证在C盘下面有 如下图所示目录 如果没有所示目录 需要自行创建 C:\Program Files\Microsoft\Edge\Application 接下来直接安装浏览器即可 点击下载Edge浏览器

edge浏览器安装扩展插件(主题等)报错:出现错误Download interrupted

1、将记事本以管理员身份运行 2、文件—>打开C:\Windows\System32\drivers\etc\hosts 3、在hosts文件里面最后面,添加(不需要添加井号): 131.253.33.219 edge.microsoft.com 131.253.33.219 msedgeextensions.sf.tlu.dl.delive…

chrome浏览器如何避免network报错:ERR_CERT_AUTHORITY_INVALID并添加为例外或继续前往

版权声明:转载请注明作者(独孤尚良dugushangliang)出处:https://blog.csdn.net/dugushangliang/article/details/101421339 本文接续https://blog.csdn.net/dugushangliang/article/details/85275319 促使我顿悟的链接&#xff1…

edge浏览器安装扩展插件报错:出现错误Download interrupted【更新版】

文章目录 一 前言二 方法一三 方法一遇到问题四 方法一的终极方法五 方法二 一 前言 由于作者本文章是之前作者遇到问题时,记录而来。并不能保证可以解决大伙的问题最近,看到读者的反馈,进行了更新和升级!希望能够提供帮助&#…

这些“约X”App,千万别再用了...

推荐阅读:996加班累到肺部切除,一名程序员的维权之路! 最近,各地警方发出警告,提醒家长们注意,小孩手机里有没有装「密聊软件」,并表示还说诈骗分子会通过这些软件诱导小孩纸犯罪。 密聊是什么软…

浏览不良网站一定会有记录吗?

来源:zhihu.com/question/371617052 前几天刷知乎,看到一个很意思的问题! 浏览量高达2000万,说明大家对这类话题还是比较关注的。 这里大家整理一些网友的回答,仅供参考。 # 匿名用户 A 回复 都注意点吧,兄…

数影周报:LastPass数据泄露事件最新细节

本周看点:LastPass:关键运维员工遭定向攻击;Waymo今年第二轮裁掉137名员工;国家网信办发布《个人信息出境标准合同办法》;京麦商家“取消订单页面”升级;“智研汇”获千万级天使轮投资...... 数据安全那些事…

当程序员遇上钓鱼信息,反应太真实了

事情是这样的, 最近小编公司小伙伴频频收到了公司内部人员发出的邮件, 要么是让你扫码领取社保补贴, 要不就是以老板的名义让你加Q有工作安排给你, 这么一看大家其实就明白了,这就是骗子钓鱼贴, 一旦你…

刘煜辉:关于经济和股市的几条建议

省时查报告-专业、及时、全面的行研报告库 省时查方案-专业、及时、全面的营销策划方案库 【免费下载】2023年5月份全网热门报告合集 普通人如何利用ChatGPT变现赚钱? 无需翻墙,无需注册,ChatGPT4直接使用 ChatGPT提词手册,学完工…

ChatGPT4太强了 和chat3不是一个层次

chat4是真的强 都可以自己玩机器学习的内容了,下面是和chat3的一些比较 模型大小:GPT-4可能会比GPT-3更大,拥有更多的参数。模型的参数数量的增加通常意味着更好的模型性能和更强大的生成能力。 训练数据:GPT-4可能使用了更大和更…

Java使用joml计算机图形学库,将3D坐标旋转正交投影转为2D坐标

最近遇到了一个困扰我许久的难题,现将解决方案分享出来 由于我们的项目侧重点在前端绘图,导致了前后端工作量不协调,我后端接口很快就能写完,而前端一个图要画好久,领导见状将前端的任务分到后端一部分用Java代码来实…