LoginSignup
97
77

More than 5 years have passed since last update.

CSSで数字だけフォントを変えたい

Posted at
<p class="f">Give me 5000 trillion yen</p>
<p>Give me 5000 trillion yen</p>
@font-face {
  font-family: number;
  src: local('Hiragino Mincho ProN');
  unicode-range: U+0030-0039;
}

.f {
  font-family: number;
}

image.png

font-face を定義し、 unicode-range で数字の範囲だけ指定すれば OK。

サンプル(CodePen)

なお Google Fonts を使う場合はもっとかんたんで、
https://fonts.googleapis.com/css?family=Anton&text=0123456789
というように数字を指定して読み込めばOK。

97
77
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
97
77