css - 文本 Sprite 样式

Question

有没有办法定义一个文本sprite有更多样式选项，然后只是大小和字体，如示例所示？

{
    type: "text",
    text: "Hello, Sprite!",
    fill: "green",
    font: "18px monospace"
}

具体来说，我想让它加粗或加下划线。

我试过这样的 style 配置:

style: {
    'text-decoration': 'underline'
}

我也试过像这样在字体配置中设置它:

font: "underline 18px monospace"

均无效。

这句话来自Ext.draw.Sprite#font config in the docs听起来很有希望，但它非常神秘:

Uses the same syntax as the CSS font parameter

我一直在谷歌上搜索 CSS 字体参数，但没有找到太多用处。也许如果有人知道这意味着什么，他们可以阐明这一点。

Answer 1

font css 属性可让您指定粗体和斜体，但下划线是使用 text-decoration 属性设置的。您需要使用样式配置:

{
    type: "text",
    text: "Hello, Sprite!",
    fill: "green",
    font: "bold 18px monospace",
    style: {
        textDecoration: "underline"
    }
}

工作演示: http://jsfiddle.net/gilly3/WSQv9/ .在 Chrome 和 IE9 中测试。 Firefox doesn't yet support underline in SVG .

作为引用，这里是字体参数定义:
MSDN
MDN