Question

在SVG中，您可以执行以下操作（具有内联伪状态的嵌套样式标记）：

<svg xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink">

    <!-- nested style tag --> 
    <style type="text/css" >
      <![CDATA[

        circle {
           stroke: #006600;
           fill:   #00cc00;
        }
        circle:hover {
           stroke: #FF6600;
           fill:   #00ccFF;
        }

      ]]>
    </style>

    <circle  cx="40" cy="40" r="24"/>
</svg>

你能否以某种方式为HTML元素做同样的事情，例如按钮？

<input type="button" value="Button">

    <style type="text/css" >
      <![CDATA[

        this {
           color: #006600;
        }
        this:hover {
           color: #FF6600;
        }

      ]]>
    </style>

</input>

或嵌套样式标记：

<input type="button" value="Button">
    <style>
       <color>#006600</color>
    </style>
    <style state="hover">
       <color>#FF6600</color>
    </style>
</input>

或内联伪样式：

<input type="button" style="color:#000000" style.hover="#ff6600" value="Button"/>

我发现了其他帖子，但他们已经有几年了。此外，我知道关注点的分离和使用外部样式表。这是一个原型工具。当用户发布CSS时将被分离出来。

PS。有一个非常有效的理由只使用内联而不是CSS;如果您要创建HTML电子邮件新闻快报，因为Gmail现在仅支持内联样式并剥离ID标记和样式块

Answer 1

使用内联样式属性：

<div style="width:20px;height:20px;background-color:#ffcc00;"></div>

有没有办法设置内联伪样式，添加嵌套样式标记或嵌套样式或属性？

1 个答案: