纯 css3 实现各种图形样式，譬如云朵、小花，房子🏠，这些用什么软件做的？

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

V2EX 提问指南

这是一个创建于 1749 天前的主题，其中的信息可能已经有所发展或是发生改变。

CSS3

云朵

譬如

样式

13 条回复 • 2020-03-07 12:59:27 +08:00

DreamCMS

2020-03-06 20:59:42 +08:00

我看过很多复杂的 css3 的动画，有风车的，看到代码，都是不可思议 css3 构成，难道都是她们敲上去的？

hua123s

2020-03-06 21:04:13 +08:00 via iPhone

svg 还是 css 还是 canvas ？

DreamCMS

2020-03-06 21:05:38 +08:00

http://www.webhek.com/post/4-css3-pictures.html

这些都是如何制作的呢？？

DreamCMS

2020-03-06 21:05:50 +08:00

@hua123s css3

heiybb

2020-03-06 21:08:11 +08:00

AE 做的动画好像可以导出成 CSS
这样的图形应该同理

easylee

2020-03-06 21:09:15 +08:00

看过腾讯某个前端团队发过这样的制作过程，是代码敲得......

codehz

2020-03-06 21:11:02 +08:00

还用问，都是手写的啦
还有这种
https://diana-adrianne.com/

DreamCMS

2020-03-06 21:11:10 +08:00

@easylee 这得有多大的图像容器理解能力啊

unicloud

2020-03-07 01:39:42 +08:00 via iPhone

其实大多是利用 CSS 3+伪类实现的。

Mutoo

2020-03-07 05:48:07 +08:00

@DreamCMS 这种粒度比较小的，一般是直接手工做的。
玩法很多种，早期是用多 div 拼接，后来用 css + 1 div 借助 background-image 支持多图，直接叠加起来。
有很多这种 single div 艺术创作：
https://a.singlediv.com/

#7 的那种极复杂的艺术图一般是用矢量软件绘制，然后通过脚本翻译成 css background-image 的形式，再微调。

Mutoo

2020-03-07 05:49:24 +08:00

@Mutoo 一步一步教你绘制基本形状的教程
https://hacks.mozilla.org/2014/09/single-div-drawings-with-css/

maomaomao001

2020-03-07 11:26:56 +08:00

最近好像还有个纯 css 画出来的一个画

efcndi

2020-03-07 12:59:27 +08:00

这种应该是字体图标吧