html - 可以减少跨度/内联元素内容及其边框之间的空白吗？

Question

我有一些内联文本标记为跨度。我已经给 span 一个底部虚线边框（以将其与超链接区分开来），但是 span 内容和边框之间的距离有点太大了。有没有办法减少它？

我已经尝试过对边距/填充进行归零/否定（完全应该是一个词）以及减少元素的行高，但没有运气。当然，减少内联跨度的行高可能不起作用。

body {
    margin: 10px;
}

span.test {
    color: orange;
    border-bottom: 1px dashed orange;
}

score 4 · Accepted Answer

我已经设法通过结合使用display: inline-block;和line-height: 1em;

当然，如果你需要的不是这个，那就降低行高。

score 1 · Accepted Answer

将显示更改.test为inline-block。然后，您可以更改其line-height. 减小line-height将向上移动边框，而不会影响字体大小或周围的文本。

2 回答 2