更改span元素

我试图通过投入span元素选定的文本，然后给跨度彩色底边框，像更改span元素

border:bottom: 1px solid red;

这个工程实现彩色下划线的高度，但该线太远下的单词：

这里的整个跨度元素的边框：

有谁看的方式来降低高度Ø f span元素，所以底部边界更接近单词？

感谢

2017-02-17 Steve

您也可以使用高度。

span { 
 
    border-bottom: 1px solid red; 
 
    display: inline-block; 
 
    line-height: 20px; 
 
}

Does anyone see a way to <span>reduce</span> the height of the span element so the bottom border is closer to the word?

2017-02-17 01:59:42

感谢。这工作，但它并没有真正给我我想要的彩色下划线。所需的实际高度值对于每种字体大小都是不同的，将下划线放在它应该去的地方，并且打开一堆蠕虫。所以我现在只是坚持标准的黑色下划线。 – Steve

将高度改为线条高度比高度更有意义 –

完美！ 'line-height'：currentFontSize'工作。这是解决方案！谢谢。 – Steve

内联元素不具备的高度，这样你就可以在显示属性更改为类似inline-block，然后使用line-height属性移动边界更近：

span { 
 
    border-bottom: 1px solid red; 
 
    display: inline-block; 
 
    line-height: 10px; 
 
}

Does anyone see a way to <span>reduce</span> the height of the span element so the bottom border is closer to the word?

2017-02-17 01:45:46 j08691

回答