更改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

回答