HTML CSS 增加 SVG 图标的描边/厚度答案

【问题标题】：HTML CSS Increase Stroke/Thickness for SVG IconHTML CSS 增加 SVG 图标的描边/厚度
【发布时间】：2019-06-27 15:41:27
【问题描述】：

刚学html，如何增加 SVG 谷歌图标的笔画宽度？这似乎不起作用。

HTML：

<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.indigo-pink.min.css">
<script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>


<i class="material-icons" style="stroke-width: 100"> arrow_forward</i>

【问题讨论】：

标签： javascript html css asp.net-core google-material-icons

【解决方案1】：

我看起来您正在尝试增加 SVG 的大小，而不是更改单个笔划的大小。如果是这种情况，那么您更有可能想要使用font-size。这将调整整个图标的大小。

<i class="material-icons" style="font-size: 100px;"> arrow_forward</i>

【讨论】：

我要更改实际笔画的大小，而不是大小，谢谢
我想我现在明白了。你们很多人都想尝试链接这个<i class="material-icons" style="-webkit-text-stroke-width: 5px;"> arrow_forward</i>。从开发人员的说明来看，它似乎在 Internet Explorer 中不起作用。

【解决方案2】：

stroke-width 属性定义了 svg 标签内元素的线条、文本或轮廓的粗细。

增加字体大小会修复它。

【讨论】：

增加字体大小。
你能写出上面的完整工作代码吗？我可以送积分，谢谢
我想改变实际笔画的大小，而不是大小，谢谢
将google图标下载为svg，并添加stroke属性。