tinymce-4 - TinyMCE 中的图标是如何工作的？

Question

我似乎无法在互联网上找到有关此的任何信息，但是 TinyMCE 4 中的图标如何工作？

我知道我可以按名称为按钮指定图标并为我的自定义按钮指定自定义图标，但是如果我想采用标准图标之一，在图像编辑应用程序中修改它，然后将其另存为自定义图标怎么办。我从哪里获得该图标的源图像？我在哪里可以看到可用图标及其名称的完整列表？

Answer 1

因此，这可能是对我自己的问题的部分答案，或者至少是我根据目前针对 TinyMCE 4 的这一方面存在的糟糕文档而设法理解的内容。

TinyMCE 4.x 中的图标使用自定义 IcoMoon字体。此字体的文件位于 skins//fonts 目录中。

如果您 download the TinyMCE Dev Package ，您可以在 js/tinymce/skins/lightgray/Icons.less 中找到可用于该特定皮肤的所有图标，并且您将能够将这些图标用于您的自定义按钮(如果您正在使用该皮肤)。

你需要在“-i-”和“:before”之间使用这个词。例如如果 Icons.less 中的定义是:

.@{prefix}-i-alignleft:before

您可以使用关键字 alignleft作为自定义按钮的图标。

我还没有为默认设置添加更多图标，但我想这将涉及创建一个新主题，希望从父主题继承，并定义您自己的 Icons.less 文件，然后处理该 LESS 文件以生成适合您的主题的 CSS。