TinyMCE:通过使用链接标签手动加载样式表

TinyMCE: manually loading stylesheets by using link-tag

本文关键字：加载 样式 标签 链接 TinyMCE      更新时间：2023-09-26

我开始在现有项目中使用TinyMCE。不幸的是，这个项目使用了一个样式表，它为选择器#content td声明了CSS规则，这是设计者的一个错误决定。这些规则打破了TinyMCE的主题。然而，这些规则在项目中经常被应用。因此，替换它们太费力气了。

#content td规则具有更高的优先级，因为它们在TinyMCE从javascript加载它的CSS规则之前加载。如果我能够通过使用<link>标记加载TinyMCE CSS，那么我可以通过在项目的样式表之前加载TinyMCE样式表来解决这个问题。

  • 假设正确吗?
  • 有一种方法手动加载tinyMCE样式表通过链接标签?
  • 你有其他的想法吗?

与javascript相比，使用link标签加载tinyMCE的样式并不能解决问题，因为问题在于CSS的特异性。

CSS规则规定，最后一个有效且专一性最高的规则优先。

TinyMCE的表规则形式为.mceitemtable td，其专一性为0,1,1。您的#content td规则以一个ID开始，该ID的专一性为1,0,1。

因此，ID规则总是优于tinyMCE的基于类的规则，无论它们加载的顺序如何。

有关CSS特性的更多详细信息，请参阅http://www.stuffandnonsense.co.uk/archives/css_specificity_wars.html。

(旁白:我不认为TinyMCE加载CSS通过javascript反正?tinyMCE的默认行为是在iframe中加载编辑器，检查iframe会显示该框架通过<link>标签加载自己的CSS。

您可以加载自己的样式表，以便覆盖默认的tinymce css。看一下tinymce设置content_css.

相关文章：