Question

正如标题所说，我如何在Adobe Illustrator中修改svg？

例如，我得到了这个

<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="595.28px" height="841.89px" viewBox="0 0 595.28 841.89" enable-background="new 0 0 595.28 841.89" xml:space="preserve">
<text transform="matrix(1 0 0 1 225 321)" font-family="'MyriadPro-Regular'" font-size="12">This a TEST!</text>
<path fill="none" d="M177,246c0,92.859,77.824,168,174,168"/>
<path fill="none" d="M357,246c0,161.398-105.555,292-236,292"/>
<path fill="none" d="M288,414c0,113.311-23.252,205-51.987,205"/>
<rect x="93" y="383" fill="none" width="364" height="147"/>
<g>
    <rect x="167" y="272" fill="none" width="216" height="244.5"/>
</g>
<rect x="476" y="428" fill="none" width="216" height="244.5"/>
<rect x="121" y="230" fill="none" width="403" height="231"/>
<rect x="179" y="158" fill="none" width="362" height="454.25"/>
<rect x="73" y="230" fill="none" width="294" height="184"/>
<rect x="371" y="516.5" fill="none" width="12" height="13.5"/>
<rect x="167" y="143" fill="none" width="221" height="387"/>
</svg>

（它不包含任何东西，它只是一个随机的svg）。

我必须先将其下载为.svg吗？我怎样才能将其下载为.svg？

Answer 1

将其粘贴到名为whatever.svg的文本文件中，然后在Illustrator中打开该文件。

Answer 2

如果它是来自网络的图像，则可以右键单击“检查”，然后在第一个<svg>标签上的Windows中单击并复制[cntrl-c]。然后，您应该能够将enitre svg数据作为图像直接复制到Illustrator中。

如果svg数据未嵌入网页中，则可能首先需要打开它的链接到新标签页，或者从DevTools的“元素”标签中获取。

Answer 3

创建一个.html文档

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" >
	<head profile="http://gmpg.org/xfn/11">
	</head>
	<body>
		<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="595.28px" height="841.89px" viewBox="0 0 595.28 841.89" enable-background="new 0 0 595.28 841.89" xml:space="preserve">
			<text transform="matrix(1 0 0 1 225 321)" font-family="'MyriadPro-Regular'" font-size="12">This a TEST!</text>
			<path fill="none" d="M177,246c0,92.859,77.824,168,174,168"/>
			<path fill="none" d="M357,246c0,161.398-105.555,292-236,292"/>
			<path fill="none" d="M288,414c0,113.311-23.252,205-51.987,205"/>
			<rect x="93" y="383" fill="none" width="364" height="147"/>
			<g>
				<rect x="167" y="272" fill="none" width="216" height="244.5"/>
			</g>
			<rect x="476" y="428" fill="none" width="216" height="244.5"/>
			<rect x="121" y="230" fill="none" width="403" height="231"/>
			<rect x="179" y="158" fill="none" width="362" height="454.25"/>
			<rect x="73" y="230" fill="none" width="294" height="184"/>
			<rect x="371" y="516.5" fill="none" width="12" height="13.5"/>
			<rect x="167" y="143" fill="none" width="221" height="387"/>
		</svg>
	</body>
</html>

在浏览器中打开它。打开打印并按“另存为.pdf”

现在您可以在Illustrator中打开它。

Example

HTML SVG - 是否可以将<svg>导入Adobe Illustrator进行修改？

3 个答案: