使文本背景颜色完全适合文本，删除'填充'

Question

我需要能够在此文本周围创建一个黑色背景，而不是在顶部或底部填充。目前，填充是0，但我需要能够以某种方式剪辑它？我的意思是这是当前的文字：

我需要它像这样：

我不介意如何实现这一目标，只要它仍然可以在上方和下方具有透明背景。

当前的css是：

padding:0em 0.2em 0em 0.2em;
display:inline-block;
background-color:#000;
color:#FFF;

谢谢！

Answer 1

添加低于1.0em的line-height属性，例如：

line-height: 0.75em;

请注意，这不适用于内联元素，因此请确保display设置为block或inline-block。

您可能还需要使用padding-top和/或padding-bottom微调垂直定位，具体取决于所使用的字体。

Answer 2

您需要的行高低于font-size：

padding:0em 0.2em 0em 0.2em;
display:inline-block;
background-color:#000;
color:#FFF;
font-size: 21px;
line-height: 15px;

确保显示是阻止或内联阻止。

MrSlayer只是打败了我！

Answer 3

这是JSBin

将CSS设为如下

padding:0.2em 0.2em 0.2em 0.2em;
display:inline-block;
background-color:#000;
color:#FFF;
font-size:25px;  
line-height:8px

Answer 4

这个怎么样

<强> FIDDLE

<div>Some text</div>

CSS

div
{
    position: relative;
    display: inline-block;
    color:#fff;
}
div:before
{
    content: '';
    display: inline-block;
    margin: auto;
    background: #000;
    width: 100%;
    height: 68%;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    z-index: -1;       
}