基本的SVG样式属性

SVG的样式属性和CSS的语法非常接近，有时甚至是一样的，经常会照成一些使用上的混乱。

注意，我们在这里讨论的是用于SVG代码本身出现的规则，而不是SVG被嵌入网页后被附加上去的规则样式。然而，如果你想从CSS属性来了解SVG，比较他们的语法规则是一种有效果的方法。

下面的属性在SVG和CSS中是一样的，只是在SVG的transformations和dimensions中稍有区别：

• font-family, font-size, font-style, font-variant 和 font-weight
• width 和 height
• scale, rotate, skew

大多数的这些属性可以作为SVG样式规则的一部分，如果你想实现类似CSS背景色的效果，这可能是最简单的实现方法。来看下面的一段SVG代码：

Test paragraph

你可以看到下边的结果：

CSS和SVG之间的渐变方式是有所不同的，你可以自行去查阅这方面的资料。

注意，我们在SVG中不用指定单位，至少上面的代码中就没有指定，它默认的单位是像素。

看到这里，你不要认为SVG的规则样式是CSS样式的更简单的表现形式。SVG提供了很多控制方式，如上所述，SVG可以绘制出各种形式的虚线，而且不像CSS3的border-image那样复杂。看到这里你应该可以开始给你自己的SVG添加样式了。

服务器托管，北京服务器托管，服务器租用 http://www.fwqtg.net
机房租用，北京机房租用，IDC机房托管， http://www.e1idc.net