css背景颜色只有文字对齐

Question

我想仅设置对齐文本的背景颜色 （例如，当鼠标选择文本时）

我尝试过div，

在span内

或div，

或p没有margin，

或h1显示内联，

但这些解决方案中没有一个解决了我的问题。

我不表示::selection伪，但始终显示的文字背景

我想要这个：

请帮忙

Fiddle

Answer 1

您可以尝试this

HTML

<div class="CC ">
    <div class="bg">Lorem ipsum dolor sit amet</div>
</div>

CSS

.bg {
    background-color:red;
    display:inline;
    padding: 1px 0
}

Answer 2

将background属性设置为您喜欢的颜色。

Updated JSFiddle.

Answer 3

您可以尝试这样做： DEMO

<强> HTML：

  <div class="CC ">
        <div class="bg">Lorem ipsum dolor sit amet
</div></div>

<强> CSS：

.bg {
    background-color:red;
    display:inline;
}

Answer 4

所需的外观需要使用内联元素，因为这是停止文本结束的背景的方法。由于您还需要对齐文本（需要块元素），因此需要两个元素：span，包含块的所有文本，嵌套在div或p中：

<div class="CC"><span class="CCC">Lorem ipsum ... in futurum.</span></div>

您只需在span元素上设置背景：

.CCC { background: red; color: yellow }

Answer 5

你可以这样付出

::selection {
    background: #ffb7b7; /* Safari */
    }
::-moz-selection {
    background: #ffb7b7; /* Firefox */
}

或

p::selection {
    background: #ffb7b7; /* Safari */
    }