我找到了一个脚本，它可以精确地完成此操作（为图层生成CSS和HTML，并提供以％值导出这些内容的选项），并为Photoshop将Web开发的工作减少了一半。现在，我很想知道是否有人遇到/使用了插件，或者可以指出我的本地功能，例如Sketch应用程序的功能。缺少这样的做法使我过渡到Sketch时非常痛苦。还是刚开始使用Sketch，我只是缺少了一些关于Sketch与CSS和HTML配合使用的思想上的差异。

这可能不是您要找的答案，但是我发现它比将平庸的自动生成的样式交给工程师更好。

选择性标记

我确定您已经找到了Sketch的上下文菜单CSS抓取器。您可以选择任意数量的对象，并且将CSS放在剪贴板上的速度比粘贴它的速度更快。

当然没有选择器，实际上只是CSS注释。每个块都由前面使用图层名称的注释来调用，如下所示：

/* Rectangle 1: */
background: #C7C1B5;

/* Rectangle 1 Copy: */
background: #F5E618;

/* Rectangle 1 Copy 2: */
background: #FFFFFF;

文件注释

Sketch Measure是一个插件，可以根据您的规范生成各种级别的注释。这里有一个演示视频。基本思想是注释重要数字，并让开发人员编写自己的代码。

超越注解

您也可以单独或组合使用以下工具：

• Zeplin为您的开发人员检查创建了一个可共享的Sketch设计独立版本，并按需提取了规格。
• Marvel是导入Sketch文件的原型工具。没有什么能像交互式原型一样进行交流了！

实验性HTML产生器

我从未使用过它，并且显然处于开发的早期阶段，但是Blade插件看起来很有希望。

Blade是一个Sketch 3插件，用于自动生成HTML。它将为组生成标签<div>，为文本生成标签<p>等。

请参阅以下链接 http://blog.mengto.com/the-best-hidden-features-in-sketch/

关注Meng To的博客，以获取有关有趣的Sketch教程，技巧甚至技巧的最新信息。 http://blog.mengto.com/ https://designcode.io/