如何仅将“见解”一词设为紫色，而将短语的其余部分设为白色？

Question

<div class="heading">Get **insights** that help your business grow.</div>

.heading {
    font-family: 'Inter', sans-serif;
    font-size: 35px;
    font-weight: 700;
    color: white;
    margin-bottom: 38px;
}[i want to do the same thing that is on the image](https://i.stack.imgur.com/7n5dP.jpg)

我尝试围绕“标题”div 内的“见解”作品创建一个 div，并将 Purple 属性放入此 div 中，但文本最终中断并创建另一行，仅包含“见解”一词，但我不这样做不想那样。我想要正常的文字

Answer 1

由于

div

默认具有

display: block

，因此您可以使用

span

来实现这一点。

.heading {
    font-size: 35px;
    font-weight: 700;
    color: black;
    margin-bottom: 38px;
}
span {
  color: purple;
}

<div class="heading">Get <span>insights</span> that help your business grow.</div>