Question

有些奇怪 - 我正在尝试使用简单的HTML文件来显示下划线和＆amp;上划线（但它也发生在文本的“直通”值上）（在一个单独的CSS文件中写这个）但是在任何浏览器上我检查它都不起作用（我已经安装了Chrome，Firefox，Opera，IE和Safari - 所有这些都可能是最新版本，所以不像Chrome版本6 ......）。

当我删除其他值并仅指定一个时 - 它可以工作但是当我添加另一个时 - 文本装饰风格的所有效果都消失了。

有人知道这种风格的问题吗？

提前感谢。

P.S。我把这些值放在同一条线上，例如：

h1, h2 {
    text-decoration: underline, overline, line-through;
}

Answer 1

你需要用空格分隔它们：

h1, h2 {
        text-decoration: underline overline line-through;
    }

<h1> FUNNY </h1>

Answer 2

同意nadavage：我也玩过，发现： CSS中的逗号适用于不支持字体或值的情况。所以，如果我写：

    font-family: 'Lorem Ipsum', cursive;

如果“Lorem Ipsum”不是OS上注册字体的名称或导入的，它将显示大多数浏览器支持的“草书”字体。在你的情况下，要立即做所有这些，你会放空间，但有些属性需要多个参数，例如

    text-shadow: 2px 2px rgba(0, 0, 0, 0.4);

预计每个参数只有一个值 - 大多数浏览器都可以破译哪个参数和使用内容的值。

希望这有帮助！

Answer 3

~~我从未见过接受多个值的文本修饰规范。请参阅此处http://www.w3.org/TR/CSS2/text.html#propdef-text-decoration~~ （每天学习新知识！）

您可以通过以下方式以不同的方式实施。

<强> HTML

<p>Some text here and then <span class="underover">underline and overline</span> and some more text here.</p>

<强> CSS

.underover {
  border-width: 1px 0;
  border-style: solid;
  border-color: blue blue red red;
}

请参阅此codepen以获取示例：http://codepen.io/keithwyland/pen/Eagbz

无法获得显示的文本修饰的多个值

3 个答案: