添加笔画会增加笔画宽度
Adding stroke increases the stroke-width
我已获得此 svg 文件以添加到项目中,作为 SVG 的新手,我确定我错过了一些东西。
在我添加描边来改变颜色之前似乎没问题,一旦应用它,描边宽度似乎会增加。
我不确定这是否与小数位有关,我知道这会导致线条模糊,但我认为这不是这里的问题。
我试过在g标签上加笔划,也在path标签上试过。
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>
是的,它会增加,因为路径是一个形状,要更改颜色,您必须使用“填充”属性。描边在形状周围添加描边,从而扩大形状。看例子:
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)" stroke="#f0f" stroke-width="3%">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)" fill="#f0f">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>
我已获得此 svg 文件以添加到项目中,作为 SVG 的新手,我确定我错过了一些东西。 在我添加描边来改变颜色之前似乎没问题,一旦应用它,描边宽度似乎会增加。
我不确定这是否与小数位有关,我知道这会导致线条模糊,但我认为这不是这里的问题。
我试过在g标签上加笔划,也在path标签上试过。
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>
是的,它会增加,因为路径是一个形状,要更改颜色,您必须使用“填充”属性。描边在形状周围添加描边,从而扩大形状。看例子:
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)" stroke="#f0f" stroke-width="3%">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="dual-antenna"
version="1.1"
viewBox="0 0 8.4666664 8.4666664"
height="32"
width="32">
<g transform="translate(0,-288.53333)" fill="#f0f">
<path d="m 3.2397571,288.88475 c -0.7236992,0.002 -1.4512336,0.19341 -2.0203358,0.6029 C 0.65031914,289.89714 0.25,290.54944 0.25,291.36624 v 3.02026 a 0.33705214,0.33705214 0 0 0 0.33717329,0.33564 H 2.2278512 v 1.64068 A 0.33705214,0.33705214 0 0 0 2.5654105,296.7 h 5.3043953 a 0.33705214,0.33705214 0 0 0 0.337173,-0.33718 v -3.01871 c 0,-0.82167 -0.3993311,-1.47682 -0.9690349,-1.88596 -0.3093926,-0.22218 -0.6663766,-0.37745 -1.04319,-0.47465 -0.1028153,-0.6423 -0.4569433,-1.16012 -0.934661,-1.50319 -0.5697045,-0.40914 -1.2966364,-0.59708 -2.0203358,-0.59556 z m 0.00117,0.67435 c 0.6025681,-0.002 1.2013914,0.1633 1.6263878,0.46849 0.2983405,0.21425 0.5146716,0.48683 0.6179578,0.84197 -0.089523,-0.006 -0.1795069,-0.008 -0.269198,-0.008 -0.7236992,0.002 -1.4496886,0.1934 -2.0187908,0.60289 -0.5691021,0.40952 -0.9694213,1.06335 -0.9694213,1.88017 v 0.70523 h -1.303508 v -2.6831 c 0,-0.60759 0.2634246,-1.02507 0.6890229,-1.33132 0.4255985,-0.30624 1.0249784,-0.47455 1.6275463,-0.47583 z m 1.9766926,1.97631 c 0.6025679,-0.002 1.20255,0.16483 1.6275463,0.47002 0.4249964,0.30521 0.6874776,0.72457 0.6874776,1.33868 v 2.68153 H 2.902584 v -2.68153 c 0,-0.60762 0.2634244,-1.02664 0.6890228,-1.33289 0.4255983,-0.30623 1.0234332,-0.47452 1.6260013,-0.47581 z" />
</g>
</svg>