从stringin css中选择前三个字符

Question

我有一个名为＆＃34; Happy Starting＆＃34;的标题。现在我想只在前三个字符下划线。例如，＆＃34; Hap＆＃34;只有而不是整个＆＃34;快乐＆＃34;。

如何选择＆＃34; Happy＆＃34;的前三个字符？在css？

Answer 1

CSS没有任何可以帮助您设置特定或任何n个字符样式的内容。

实现此目的的一种方法是将这3个字符放在span中并使用css设置样式。

喜欢的东西     

＆＃13;

＆＃13;

.word{
    color: green;
}
.word span{
   color: red;
   text-decoration:underline;
}

＆＃13;

<div class="word"><span>Hap</span>py Starting</div>

＆＃13;

＆＃13;

＆＃13;

检查这个小提琴 https://jsfiddle.net/LfsLpz5g/

或者您也可以使用<u> html标记。

Answer 2

复制答案：change color css only first 6 character of text

如何使用:before？

我会更改＆＃34;客户见证＆＃34;到＆＃34; Testimonial＆＃34;，然后使用CSS应用:before规则：

<强> HTML：

<div class="word">Testimonial</div>​​​​​​​​

<强> CSS：

.word {
 color: black;       
}
.word:before {
 color: red;
 content: "Client ";
}

示例：http://jsfiddle.net/LvZt7/

Answer 3

使用span标记

HTML span标记用于将样式分组并应用于内联元素。

span标记和div标记之间存在差异。 span标记与内联元素一起使用，而div标记与块级内容一起使用。

＆＃13;

＆＃13;

span{
  text-decoration:underline;
  }

＆＃13;

<p><span>Hap</span>py Starring</p>

＆＃13;

＆＃13;

＆＃13;

Answer 4

你可以这样做：

<h1><u>Hap</u>py Starting!</h1>

＆＃39; u＆＃39;标记下划线，只显示其中的文字。

Answer 5

解决问题的快捷方法

<span style="text-decoration: underline;" >Hap</span>py Starting

或

指定span标记的ID，您可以在css部分

中对其进行自定义

<span id="someid" >Hap</span>py Starting

在css中

#someid
{
   text-decoration: underline;
  //do whatever you want
}