使用在线编辑 svg 软件修改 svg 图片
网站需要使用图标字体,但设计师给的图标大小有问题,故使用下面说陈述方法简单修改了一下。使用到的在线编辑软件地址为:https://editor.method.ac/
问题:

注:至于如何使用图标字体(阿里 iconfont,icomoon),请自行查找资料,此处便不解释了。
调整后所需要 svg 图:

具体方法:
1、打开网站,并在左上角“File” -- "Open SVG...",打开已有的 svg 图片

2、此处简单介绍一下界面

3、背景色设置透明


4、设置svg大小
1)设置精确数值、Sizes选项自适应调整svg大小

2)手动缩放svg图大小
若觉得展示图片过小,可选此调大可视范围


5、调整完毕

6、导出svg图,选择左上角 “File"--"Save image..." 即可,浏览器自行下载(所用谷歌浏览器)

然后找到保存的svg图片,可以用浏览器方式打开,查看其周围的多余空白是否已经没有。(查看方式便不解释了,相信你会的)
使用在线编辑 svg 软件修改 svg 图片的更多相关文章
- 小讲堂:在线编辑在Mobox文档管理软件中的意义
今天我们来讨论一下,mobox文档管理软件中的在线编辑的这个功能,相信这个功能是用户在日常的文档维护中非常需要的. 文档管理软件的诸多功能中,在线编辑是一块很重要的功能点,因为在线编辑可以说是提高工作 ...
- Firefox使用svg blur滤镜渲染图片
很久没来更新博客了,今天正好比较闲,就写一篇手头项目上遇到的一个css问题: .mature .blur { -webkit-filter:blur(25px); -moz-filter:blur(2 ...
- SVG如何做圆形图片
SVG如何做圆形图片 2016年5月31日17:30:48 提到圆形图片,大家首先想到的一定是border-radius,但在SVG中这些方法很难起效,下面方法适合SVG中制作任意规则与不规则的图形. ...
- html5 svg实现不规则形状图片触发事件
html5 svg实现不规则形状图片触发事件<pre><!DOCTYPE html><html lang="en"> <head> ...
- 在线编辑Word——插入图片、图形
在Word中支持插入图片.图形等元素,同时支持对插入的图片和图形进行格式化操作,如裁剪.调整尺寸大小.调成颜色.阴影.倾斜角度.透明度等等.本文,将通过使用Spire.Cloud Word在线编辑器来 ...
- 动态修改svg的颜色,svg做背景色时候修改颜色
svg修改背景色可以使用fill属性来修改,但是我现在需要动态改变svg的颜色,例如我hover的时候 现在发现一种兼容性还不错的方法是css属性mask 类似于给路径填充上颜色,结合backgrou ...
- SVG Drawing Animation - SVG 绘制动画
一个小实验,探索 SVG 线图动画的使用情况,以前沿的展示形式呈现图形或网站元素的外观,模拟它们的加载.SVG 真的很强大,有许多创造性和可能性,使用 SVG 可以制作各种有趣的网站交互效果.今天这篇 ...
- C# 10分钟入门基于WebOffice实现在线编辑文档,实时保存到服务器(所有office,兼容WPS)
今天,他来了(weboffice在线编辑文档). 上次写了一个在线预览的博,当然,效果并不是太理想,但是紧急解决了当时的问题. 后来,小编重新查找资料,求助大牛,终于使用新的方式替换了之前的low方法 ...
- java 网站源码 在线编辑模版 代码编辑器 兼容手机平板PC freemaker 静态引擎
前台: 支持四套模版, 可以在后台切换 系统介绍: 1.网站后台采用主流的 SSM 框架 jsp JSTL,网站后台采用freemaker静态化模版引擎生成html 2.因为是生成的html,所以 ...
随机推荐
- 四种常见的APP分类界面布局设计案例学习
相信各位对于APP设计,已经很熟练啦.如何在熟练的基础上提高我们界面的优美度,或者是进行APP界面的迭代设计. 重构APP设计布局是我们必须要经历的一个过程. 在之前,学习UI设计的时候,经常要接触到 ...
- C++-hihoCode-1105/1109-[STL][堆][prime]
#include <set> #include <map> #include <cmath> #include <queue> #include < ...
- 基于原生PHP的路由分配实现
对于由原生PHP写成的独立PHP框架,利用单一入口文件实现路径的访问.这时我们会遇到的首要问题是:文件的相互包含,其次就是路由分配.当我们不利用成熟的PHP框架进行web开发时,我们就会发现上述两个问 ...
- 揭秘jQuery-选择器
先看代码: $(“li”)只选择第一个无序列表中的一个li元素,而不会选择另一个无序列表中的li元素 <!DOCTYPE html> <html> <head> & ...
- 如何获取object数据的描述符
const data = { portLand: '78/50', Dublin: '88/52', Lima: '58/40' } Object.defineProperty(data, 'Lima ...
- Python代码混淆和加密技术
Python进行商业开发时, 需要有一定的安全意识, 为了不被轻易的逆向. 混淆和加密就有所必要了. 为了增加代码阅读的难度, 源代码的混淆非常必要, 一个在线的Python代码混淆网站. http: ...
- 神经网络的基础-Graph,Session
张量:基于 Tensorflow 的 NN:用张量表示数据,用计算图搭建神经网络,用会话执行计算图,优化线上的权重(参数),得到模型. 张量:张量就是多维数组(列表),用“阶”表示张量的维度. 0 阶 ...
- Spring Boot 升级框架版本 Spring 5.2 Invalid argument syntax org.springframework.core.env.Simple CommandLineArgs
Invalid argument syntax org.springframework.core.env.Simple CommandLineArgs Parser.parse 具体问题应该是启动的c ...
- Django组件总结
Django组件介绍 分页器的使用 分页器在页面中非常常见,当数据库条数数据过多时,页面一次性显示不好看时,我们可以使用分页器,将数据分几次显示. 1.1 数据库内插入大量数据 Booklist=[] ...
- Spring-Aop编程(三)-AspectJ
AspectJ 1. 介绍 AspectJ是一个基于Java语言的AOP框架,Spring2.0以后新增了对AspectJ切点表达式支持,@AspectJ 是AspectJ1.5新增功能,通过JDK5 ...