如何在一个块元素中只用不同的颜色来强调文本？ [英] How to underline only the text, in a different color, in a single block element?

问题描述

我想用一个元素产生以下结果：

 < style type =text / css> ; 
 div {background-color：＃000; color：#fff; } 
 span {border-bottom：1px solid＃f00; } 
< / style> 
< div>< span>白色文字，红色下划线，黑色背景< / span>< / div> 
  

jFiddle： http://jsfiddle.net/ARbmG/

这是否可能？

解决方案

相关： CSS text-decoration underline color and 更改下划线颜色

不，您不能'跨'以跨平板，跨浏览器的方式更改文本装饰下划线颜色。

• 非 - 工作解决方案或 jsFiddle工作解决方案


• W3C信息或 / css-text-decor-3 li>
  
• MSDN信息

Mozilla解决方案：

  span {
 color：#fff; 
 text-decoration：underline; 
 -moz-text-decoration-color：red; 
 / *你必须搜索其他专有选择器* / 
} 
  

否则，边界底部的内联元素：你刚刚做到了。

I want to produce the following result with a single element:

<style type="text/css">
    div { background-color: #000; color: #fff; }
    span { border-bottom: 1px solid #f00; }
</style>
<div><span>White text, red underline, black background</span></div>

jFiddle: http://jsfiddle.net/ARbmG/

Is this possible?

解决方案

related to : CSS text-decoration underline color and Changing Underline color

NO, you cannot 'yet' change text-decoration underline color in a cross-plateform, cross-browser way.

• Non-working solution or jsFiddle-working solution
• W3C infos or /css-text-decor-3
• MSDN infos

Mozilla soluce :

span {
    color:#fff;
    text-decoration: underline;
    -moz-text-decoration-color: red;
    /* you'll have to search for other -proprietary selectors */
}

Otherwise, to border-bottom an inline element : You just did it.

这篇关于如何在一个块元素中只用不同的颜色来强调文本？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！