正在忽略Svg文本元素的CSS背景属性

时间:2016-03-30 22:55:23

标签: javascript html css svg

所以我希望将以下css添加到我的所有text svg元素中:

text{
    position:relative;
    padding:15px;
    margin:1em 0 3em;
    color:#000;
    /* css3 */
    background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c)); 
    background:-moz-linear-gradient(#f9d835, #f3961c);
    background:-o-linear-gradient(#f9d835, #f3961c);
    background:linear-gradient(#f9d835, #f3961c);
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;
}

基本上这应该将文本创建为语音泡沫。

然而,似乎忽略了以下几行:

 background: -webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c));
    background: -moz-linear-gradient(#f9d835, #f3961c);
    background: -o-linear-gradient(#f9d835, #f3961c);
    background: linear-gradient(#f9d835, #f3961c);
    -webkit-border-radius: 10px;

谁能告诉我为什么?如果是这样我怎样才能将文字设计成语音泡沫?

Html标记(取自chromes检查员):

<svg id="chatSvg" width="408" height="374" class="room">
<image xmlns:xlink="http://www.w3.org/1999/xlink"xlink:href="assets/figures/naked.jpg" preserveAspectRatio="none" x="10" y="10" width="52" height="71">
</image>
<g><text x="200" y="50">hello world</text></g>
</svg>

0 个答案:

没有答案