本文介绍了SVG:使用属性还是CSS进行样式设置?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在HTML中,建议将内容与样式分开,因此您应该为样式创建外部CSS文件.当我刚开始使用SVG时,我现在想知道:此规则是否也适用于SVG?

In HTML it is recommended to seperate Content from Style, thus you should create external CSS-Files for your styles. As I am just getting started with SVG I now wonder: Does this rule also apply for SVG?

什么是更好的代码风格?

What is considered better code style?

  • <circle fill="yellow" />
  • <circle style="fill: yellow;" />
  • <circle fill="yellow" />
  • or <circle style="fill: yellow;" />

推荐答案

<circle style="fill: yellow;" />相比,我通常更喜欢<circle fill="yellow" />,因为它更短并且易于使用,例如getAttributeNS(null, "fill").

I would generally prefer <circle fill="yellow" /> to <circle style="fill: yellow;" /> because it's shorter and easily to manipulate with, for example, getAttributeNS(null, "fill").

但是除此之外,我更喜欢使用单独的样式元素,就像HTML一样,例如:

But over that I would prefer using a separate style element, just as with HTML, e.g:

  <style>
    circle{
      fill: yellow;
    }
  </style>    

使用CSS具有所有相同的优点,例如可以轻松一次更改很多元素的样式.

Which has all the same advantages of using CSS, such as making it easy to change the stlye of lots of elements at once.

您还可以将CSS放在外部文件中并添加:

You can also put your CSS in an external file and add:

<?xml-stylesheet type="text/css" href="your_CSS.css" ?>

在svg元素之前.

这篇关于SVG:使用属性还是CSS进行样式设置?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-10 17:41