在css中选择字符串的前三个字符[关闭]答案

【问题标题】：select first three characters off a stringin css [closed]在css中选择字符串的前三个字符[关闭]
【发布时间】：2016-12-19 06:51:17
【问题描述】：

我有一个名为“快乐开始”的标题。现在我只想在前三个字符下划线。例如，仅“Hap”而不是整个“Happy”。

如何在css中选择“Happy”的前三个字符？

【问题讨论】：

【解决方案1】：

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

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

类似的东西

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

&lt;div class="word"&gt;&lt;span&gt;Hap&lt;/span&gt;py Starting&lt;/div&gt;

或者你也可以使用<u> html 标签。

【讨论】：

【解决方案2】：

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

使用:before怎么样？

我会将文本从“Client Testimonial”更改为“Testimonial”，然后使用 CSS 应用 :before 规则：

HTML：

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

CSS：

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

【讨论】：

【解决方案3】：

使用span 标签

HTML span 标签用于对内联元素进行分组和应用样式。

span标签和div标签是有区别的。 span 标签用于内联元素，而 div 标签用于块级内容。

span{
  text-decoration:underline;
  }

&lt;p&gt;&lt;span&gt;Hap&lt;/span&gt;py Starring&lt;/p&gt;

【讨论】：

【解决方案4】：

快速解决问题的方法

<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
}

【讨论】：

【解决方案5】：

你可以这样做：

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

'u'标签下划线，只有它里面的文字。

【讨论】：