svg五星红旗

马黑黑

<svg width="240" height="160" viewBox="0 0 960 640" stroke="none" fill="yellow" xmlns="http://www.w3.org/2000/svg">
	<rect x="0" y="0" width="960" height="640" fill="red"/>
	<path d="M160,79 L112.3894,225.5304 L237.0356,134.9696 L82.9644,134.9696 L207.6106,225.5304Z"/>
	<path d="M292.5602,80.4639 L351.8765,66.8091 L295.8626,42.9908 L327.1787,95.1844 L332.522,34.5518Z"/>
	<path d="M352.3216,132.5255 L406.9683,105.7187 L378.5148,159.5264 L369.9069,99.2705 L412.2884,142.9589Z"/>
	<path d="M353.2312,215.2089 L403.7252,249.1976 L382.8547,192.0206 L366.1311,250.5462 L414.0597,213.0267Z"/>
	<path d="M295.0122,268.0098 L351.9655,289.485 L293.2665,305.5875 L331.2902,258.0579 L328.4656,318.8599Z"/>
</svg>

效果：

马黑黑

代码svg已经声明了命名空间，可以直接存为 .svg 文档当图片使用。

图片的尺寸按宽高 3:2 的比例使用

红影

一个个画出的五角星呢，这svg五星红旗真漂亮

红影

做国庆帖子这个正好能用上呢

马黑黑

红影 发表于 2024-9-26 21:06
做国庆帖子这个正好能用上呢

这个是很标准的，一切按国旗的比例来做

马黑黑

红影 发表于 2024-9-26 21:04
一个个画出的五角星呢，这svg五星红旗真漂亮

我曾用CSS+HTML做过，也是严格按照比例做的

花飞飞

马黑黑 发表于 2024-9-26 20:24
代码svg已经声明了命名空间，可以直接存为 .svg 文档当图片使用。

图片的尺寸按宽高 3:2 的比例使用

xmlns="http://www.w3.org/2000/svg
这个就是声明的命名空间么。。
如你所说，它的确之前有出现过。。在锯片那贴子里印象最深。别的也有。。

红影

马黑黑 发表于 2024-9-26 21:36
这个是很标准的，一切按国旗的比例来做

厉害

马黑黑

花飞飞 发表于 2024-9-26 23:00
xmlns="http://www.w3.org/2000/svg
这个就是声明的命名空间么。。
如你所说，它的确之前有出现过。。 ...

一般会存在两个命名空间，现在这个是必须的，如果svg还有 href 之类的指令，还需要 xmlns:xlink 命名空间，一点错都不允许

红影

马黑黑 发表于 2024-9-26 21:37
我曾用CSS+HTML做过，也是严格按照比例做的

这个应该严格按照比例，是对国旗的尊重呢

马黑黑

红影 发表于 2024-9-26 23:06
这个应该严格按照比例，是对国旗的尊重呢

这个是必须的，所以五个五角星都是绘制在特定比例的位置上的

花飞飞

马黑黑 发表于 2024-9-26 23:06
一般会存在两个命名空间，现在这个是必须的，如果svg还有 href 之类的指令，还需要 xmlns:xlink 命名空间 ...

锯片那个贴子就有两个。。原来 这么严格

马黑黑

花飞飞 发表于 2024-9-26 23:11
锯片那个贴子就有两个。。原来 这么严格

svg就是比较严格的，所以一般不会手动写代码，都是用软件像作图那样操作，然后生成文档，所以也会存在很多废码或无用的代码

红影

马黑黑 发表于 2024-9-26 23:07
这个是必须的，所以五个五角星都是绘制在特定比例的位置上的

黑黑做得对，很赞

花飞飞

马黑黑 发表于 2024-9-26 23:13
svg就是比较严格的，所以一般不会手动写代码，都是用软件像作图那样操作，然后生成文档，所以也会存在很 ...

明白了。。。软件操作后生成~~其实之前用过的，不过都是静态的。

马黑黑

花飞飞 发表于 2024-9-27 20:49
明白了。。。软件操作后生成~~其实之前用过的，不过都是静态的。

这个，PS生成路径代码的功能，非常好用。当然，要制作复杂的svg，可能需要基于svg的专业软件

花飞飞

马黑黑 发表于 2024-9-27 22:08
这个，PS生成路径代码的功能，非常好用。当然，要制作复杂的svg，可能需要基于svg的专业软件

PS。。。我不会用路径。啊。。。

马黑黑

花飞飞 发表于 2024-9-27 22:20
PS。。。我不会用路径。啊。。。

查一下资料，绿婆婆好像会了

花飞飞

马黑黑 发表于 2024-9-27 22:35
查一下资料，绿婆婆好像会了

那太好了，等过节吧

马黑黑

花飞飞 发表于 2024-9-27 22:45
那太好了，等过节吧