css - 在内容中设置不同字符的样式::在内容之后

Question

我只想在::after 的内容中设置一个字符的样式。是否可以？考虑到 div 里面有内容。

在这个例子中，我希望“↵”是粗体。但不是“按 ENTER”文本。

.div::after {
  content: "press ENTER ↵";
  font-size: 11px;
  color: #5a5b8d;
}

Answer 1

如果按钮中没有其他文本，您可以在 before 和 after 之间拆分文本:

.button {
  font-size: 11px;
  color: #5a5b8d;
}
.button::before {
  content: "press ENTER";
}
.button::after {
  content: " ↵";
  font-weight:bold;
}

<div class="button"></div>