当前位置: 首页 > 面试题库 >

CSS删除线与文本的颜色不同?

施驰
2023-03-14
问题内容

HTML元素delstrikes都可以用于文本删除线效果。例子:

<del>del</del>

....给出: 德尔

<strike>strike</strike> and <s>strike</s>

....给予: 罢工 罢工

text-decoration具有值的CSS 属性line-through可以类似地使用。编码…

<span style='text-decoration:line-through'>
    text-decoration:line-through
</span>

…也将呈现为: text-decoration:line-through

但是,删除线通常与文本的颜色相同。

可以使用CSS使线条具有不同的颜色吗?


问题答案:

是的,通过添加一个额外的包装元素。将所需的直通颜色分配给外部元素,然后将所需的文本颜色分配给内部元素。例如:

<span style='color:red;text-decoration:line-through'>

  <span style='color:black'>black with red strikethrough</span>

</span>

…要么…

<strike style='color:red'>

  <span style='color:black'>black with red strikethrough<span>

</strike>

(不过,请注意,HTML4中已将<strike>其视为已弃用,而HTML5中已将其视为过时(另请参见W3.org。)。建议的方法是,<del>如果打算真正删除的含义,则使用;否则,<s>text-decorationCSS中使用元素或样式,如这里的第一个示例。)

为了使删除线出现在a:hover上,<HEAD>必须使用显式样式表(在中声明或引用)。(:hover伪类不能与内联STYLE属性一起应用。)例如:

<head>

  <style>

    a.redStrikeHover:hover {

      color:red;

      text-decoration:line-through;

    }

  </style>

</head>

<body>

  <a href='#' class='redStrikeHover'>

    <span style='color:black'>hover me</span>

  </a>

</body>

(IE7似乎需要对某些href设置进行设置<a>才能:hover生效; FF和基于WebKit的浏览器则不需要。)



 类似资料:
  • 问题内容: HTML元素,或都可以用于文本删除线效果。例子: ....给出: 德尔 ....给予: 罢工 和 罢工 具有值的CSS 属性可以类似地使用。编码… …也将呈现为: text-decoration:line-through 但是,删除线通常与文本使用相同的颜色。 可以使用CSS使线条变为不同的颜色吗? 问题答案: 是的,通过添加一个额外的包装元素。将所需的直通颜色分配给外部元素,然后将所

  • 问题内容: 可以仅更改文本下面的线条颜色?我想看到类似红色字母的下面有一条蓝线的东西,但是我找不到如何完成它的方法。 问题答案: 您可以通过以下CSS规则作为示例: 如果较旧的浏览器不支持此规则,则可以使用以下解决方案: 用底线设置单词:

  • 我正在用Bootstrap创建一个网站,我想更改导航栏的文本颜色。我甚至很难瞄准导航栏,但这不是重点。基本上,我只想改变文本的颜色。它允许我更改除文本颜色以外的任何内容,例如背景颜色、字体、边框等,而不是文本颜色。这里有一个指向该页面GitHub的链接。任何帮助都将不胜感激(我的css在css/style.css中,颜色标签在.nav、.navbar、.dropdown菜单类中)。 编辑1我已经更

  • 在超文本标记语言中,我什么时候使用颜色,背景颜色和背景标签有什么区别? 有什么区别?

  • 问题内容: 所以,我有一个问题。我从Logger捕获了一些东西,输出看起来像这样: 我需要知道如何删除那些讨厌的ASCII颜色代码(或解析它们)。 问题答案: 如果它们是完整无缺的,则应由ESC()加加分号分隔的数字列表加组成。(请参阅http://codingdict.com/questions/131416。)在这种情况下,您可以通过以下方式删除它们: 。。。或者您可以通过检查日志来利用它们。