【问题标题】:SVG and CSS properties in the same file同一文件中的 SVG 和 CSS 属性
【发布时间】:2013-06-16 12:47:44
【问题描述】:

当我将 SVG 和 CSS 属性放在一个文件中时:

.circle {
    stroke: red;
}

.myArea {
    width: 100%;
}

它有效。但是根据 W3C,它是否有效?这段代码没有通过 CSS 验证器的验证测试,我找不到“CSS + SVG”选项...

【问题讨论】:

    标签: css svg w3c-validation


    【解决方案1】:

    stroke 是一个 CSS 属性(所有支持 SVG 的浏览器都支持)。我认为这可能只是验证器没有模式的情况。当前所有的浏览器都已经支持这种样式表,因为它们支持 svg。

    【讨论】:

    • stroke 不是 CSS 属性。这是一个 SVG 属性。这正是您所说的仅支持 SVG 的浏览器才支持它的原因。
    • 在规范术语中,没有“SVG 属性”之类的东西(可能作为一种非正式的方式表明这些属性在这个给定时间点仅适用于 svg 内容)。 stroke 是一个真正的 CSS 属性(就像任何其他 CSS 属性一样),唯一的区别是它是在 svg 规范中定义的,因此只有在 UA 支持 svg 时才需要。有几个例子,最初在 svg 中定义的属性已经转移到 CSS 规范中,pointer-events 就是其中之一。
    【解决方案2】:

    编辑(现在我知道你的问题是什么意思了):这可能是由于浏览器不支持 SVG 及其功能造成的。没有浏览器支持完整的 svg 格式(svg 本身非常复杂并且具有非常多的功能)。但是,大多数浏览器都支持基本功能(IE

    您可以在这里阅读更多内容:

    Use of stroke in html+svg Browser support

    【讨论】:

    • 我已经创建了一个单独的 CSS 文件。这是我在消息中向您展示的文件。
    【解决方案3】:

    我在这里找到了答案:

    Is CSS for SVG "standard" CSS?

    W3C CSS 验证具有您可以选择的选项(如果您直接通过 W3C 网站调用它)

    在“更多选项”下,您可以找到一个配置文件,其中一个选项是“SVG”。

    我最初错过了这一切,因为我通常通过 Chris Pederick 的 Firefox add-0n“Web Developer”调用 W3C 验证。

    【讨论】:

      猜你喜欢
      • 2020-02-04
      • 2018-08-18
      • 1970-01-01
      • 2014-04-10
      • 1970-01-01
      • 2013-11-10
      • 1970-01-01
      • 2013-09-23
      • 2016-07-16
      相关资源
      最近更新 更多