如何<output>用颜色设置样式？

Question

我有一个html输出表单

<output name=foo></output> 

它给出了预先计算好的值。我想在输出的下面加上一种颜色，但我找不到任何关于如何做到这一点的信息，只针对输入表单。（它们的行为似乎非常不同）。

有什么建议吗？

Answer 1

我想你的意思是下划线？不管怎样，输出是一个与其他元素一样的元素，并且可以这样设计：

/* Default */
output {
  text-decoration: underline;
  background-color: yellow;
}
    
/* Emphasise 'foo' */
output[name=foo] {
  color: red;
}

<output name="foo">Foo output</output>
<output name="bar">Bar output</output>

当然，如果它没有内容，一些样式（如文本颜色和下划线）就没有效果。

Answer 2

如果只想更改下划线颜色，请使用下面的颜色。

<output style="text-decoration: underline; color: red;">
 <span style="color: #CCC;">text with red linethrough and black text</span>
</output>

以上代码只会更改下划线的颜色。

Answer 3

您可以通过选择输出标签进行样式设置

output {
    color : red;
}