11

对于我的网页，我选择了一种适用于所有字母的字体。但是，对于所有数字，我想使用不同的字体。

有没有办法可以设置 CSS 规则来定位页面上的所有数字？

如果我不能严格使用 CSS，我的第一个想法是使用正则表达式将所有数字与“数字”类的范围包围起来，并为该类应用字体。有一个更好的方法吗？

4

2 回答 2

17

您可以通过遍历文档在 JavaScript 中相对简单地做到这一点，以便将任何数字序列包装在具有属性的span元素中并在 CSS 中声明它。classfont-family

原则上在纯 CSS 中也是可能的，尽管目前只有 WebKit 浏览器支持这一点：

@font-face {
  font-family: myArial;
  src: local("Courier New");
  unicode-range: U+30-39;
}
@font-face {
  font-family: myArial;
  src: local("Arial");
  unicode-range: U+0-2f, U+40-10FFFF;
}
body { font-family: myArial; }

最后，也是最重要的，不要这样做。如果您对字体中的数字不满意，请不要使用该字体。

于 2012-11-28T18:14:54.357 回答
1

<span class="number">用一个听起来不错的、语义上合理的方法包围你的数字。

事实上，CSS3 没有提供替代方案，而且我看不到CSS4会出现什么。如果您查看最新的 CSS3 推荐，它没有指定任何内容选择器，但旧的2001 候选推荐是提供:contains()伪类的最后一个版本。

这将让您匹配包含数字的元素：

/* Deprecated CSS3 */
p:contains(0), p:contains("1"), p:contains("2") {
    background-color: red;
}

即使这实际上是可用的，它也匹配p，而不是数字，所以整体p将被样式化......不是你想要的。CSSWG 正在围绕这些想法来格式化数字内容......仍然不是你想要的。

要将 CSS 应用于数字，不可避免地需要一些额外的标记。

于 2012-11-28T18:36:41.350 回答