Raphael.js如何在Raphael.js中使用CSS文件？
在Raphael.js中，如果我有一个文本元素：
var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");我想使用CSS来设计这个文本的样式，我成功地用CSS
($(t.node)).css('font-size', 18);但是，如果我在外部css文件中定义CSS代码呢？如何为我的文本元素专门定义css？
我尝试使用javascript：
($(t.node)).addClass('my-text');在my.css中：
.my-text {
font-size: 18
}但是它根本不起作用，因为jQuery.addClass()没有在Raphael..any中工作，不知道如何通过使用外部CSS文件来设置拉斐尔元素的样式。
回答 4
Stack Overflow用户
发布于 2011-05-26 18:00:27
似乎有一些差异无法将外部css应用于raphäel文本。我建议您使用http://glazman.org/JSCSSP/来读取和解析您的外部css，并将规则应用于您的文本。有点复杂，但可以接受。
我还测试了Raphäel 2.0，它不能工作。无论如何，我建议您试用一下新的库。它有一些很棒的附加功能：https://github.com/DmitryBaranovskiy/raphael/tree/2.0
希望这能有所帮助。
Stack Overflow用户
发布于 2011-05-26 18:10:02
您可以使用vanilla js添加一个类，如下所示：
var paper = Raphael(10, 50, 320, 200);
var t = paper.text(50, 50, "Raphaël\nkicks\nbutt!");
(t.node.className ? t.node.className.baseVal = 'mytext' : t.node.setAttribute('class', 'mytext'));但是，请注意，拉斐尔放置的内联样式将覆盖您的类，但您可以使用!important之类的东西来强制它。
注意:不建议这样做，因为您应该一开始就使用正确的属性来绘制svg，我建议您使用“工厂”方法来生成您已经设置了属性的不同svg部分。
示例(在Chrome13.0.772上测试)：jsfiddle
Stack Overflow用户
发布于 2013-11-22 19:26:57
诀窍是重置“字体”-Attribute。
拉斐尔为文本节点设置了一个“字体”-Attribute。这将覆盖您的CSS设置。对我来说，这是可行的：
var txt = paper.text(10, 10, "Big Test Text").attr({"font": ""});
txt.node.setAttribute('class', 'my-text');在我的CSS中：
.my-text {
font-size: 5em;
}要确切地看到发生了什么，请参见raphael.js，6923和558行(2.1.0版)
https://stackoverflow.com/questions/6136025
复制相似问题
腾讯云开发者
