要在一个字的单个字母的空格内添加bg颜色

我想为在单词中有空格的单个字母添加颜色。要在一个字的单个字母的空格内添加bg颜色

例如，如果我们有一个单词名称'是'，我需要填写字母'o'和'e'的颜色，其中我需要字母空间内的颜色。一封信的空间就是我的要求。

我附上了一张图片，检查字母'o，B，P'，这个字母在空间内有bg颜色。 check this image

来源

2015-05-21 Sri

不可能的CSS。 –

@Paulie_D为什么它不可能告诉我？ – Sri

**它只是没有。**你不能有多色字体，并且没有办法为一个字符的各个部分着色。角色的背景也应用于所有角色，而不仅仅是角色的一部分。 –

这是完全可能的，即使使用CSS而已，但你必须创建每个字母和字体定制的解决方案，而且，必须用它需要这个CSS中跨度的信件，并给予他们适当的类。

检查笔：

http://codepen.io/anon/pen/LVRLap

h1 { 
 
    font-size: 100px; 
 
    font-family: Verdana; 
 
} 
 
.fill-letter { 
 
    position: relative; 
 
} 
 
.fill-letter:after { 
 
    display: block; 
 
    content: ""; 
 
    position: absolute; 
 
} 
 
.o:after { 
 
    background-color: orange; 
 
    height: 45%; 
 
    left: 25%; 
 
    top: 30%; 
 
    width: 50%; 
 
    z-index: -1; 
 
}

<h1>H<span class="fill-letter o">O</span>ME</h1>

来源

2015-05-21 13:50:20 connexo

这将工作，是的，但是对于创建字体样式的时间量，你会在这附近在接下来的十年里......有成千上万的字体可供使用，许多字母有“漏洞”。 – jbutler483

没有人要求提供适用于每种字体的解决方案。我假设OP需要一个* one *字体的解决方案 - 这个工作可能会像1个或2个小时。 – connexo

要在一个字的单个字母的空格内添加bg颜色

回答

相关问题