更改 CSS `content` 属性的字体粗细答案

【问题标题】：Change font-weight of CSS `content` property更改 CSS `content` 属性的字体粗细
【发布时间】：2011-11-04 14:20:45
【问题描述】：

我需要更改部分 CSS3 内容选择器的字体粗细。只是一部分，不是全部。这是我的代码的设置方式：

HTML：<a href="#">FIRST SECOND</a>

CSS：p#first-second:after {content: "FIRST SECOND"}

我正在使用this method 在文本上创建渐变。

如果可能的话，我想用 CSS 来解决这个问题，即使它很老套。如您所见，强文本已经包含在  元素中，我可以添加 ID 或类或其他任何内容来更改它。如果 CSS 不能修复它，那么我的下一个偏好是 jQuery，然后是 JavaScript。

【问题讨论】：

我有点困惑。如果生成的内容与您的 HTML 内容完全相同，您将其用于什么用途？
用纯 CSS 创建渐变效果。
我不认为生成的内容是必要的。
content 既不是 CSS3 的新手，也不是选择器。它被称为属性。
等等，你在问什么？标题暗示你想调整某物的字体粗细，但问题的正文暗示这是一个与 CSS 渐变相关的问题。

标签： css gradient

【解决方案1】：

这是一个使用 -webkit-mask-image 将渐变效果应用于文本的快速示例：http://jsfiddle.net/joshvogt/t4Ger/

p strong{
    -webkit-mask-image: 
-webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,1)), 
to(rgba(0,0,0,0)));
    font-weight:900;
}

p{
    color:red;
    font-size:30px;
    text-shadow:2px 2px 2px black;
}

【讨论】：