D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
hnakamur
Full window
Github gist
Noto Sans CJK JP local font and webfont experiment
<!DOCTYPE html> <meta charset="utf-8"> <style> @font-face { font-family: 'Noto Sans JP'; font-style: normal; font-weight: 300; src: local("Noto Sans CJK JP"), /* NOTE: you need to use v5 (not v6) to have effect of font-feature-settings: "palt" */ url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Light.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Light.woff) format('woff'), url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Light.otf) format('opentype'); } @font-face { font-family: 'Noto Sans JP'; font-style: normal; font-weight: 900; src: local("Noto Sans CJK JP"), /* NOTE: you need to use v5 (not v6) to have effect of font-feature-settings: "palt" */ url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Black.woff2) format('woff2'), url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Black.woff) format('woff'), url(//fonts.gstatic.com/ea/notosansjapanese/v5/NotoSansJP-Black.otf) format('opentype'); } h1 { font-family: 'Noto Sans JP', sans-serif; font-weight: 900; font-feature-settings: "palt"; } body { font-family: 'Noto Sans JP', sans-serif; font-weight: 300; font-feature-settings: "palt"; } </style> <body> <h1>Noto Sans CJK JPフォントのローカルまたはウェブフォントを使う実験ページ</h1> <p><a href="https://qiita.com/sutara79/items/7f0c6365e5935311b1f8">ローカルに"Noto Sans CJK JP"がなければWebフォントの"Noto Sans JP"を利用するCSSの指定方法 - Qiita</a>の方法を検証してみて確かにその通りになることを確認しました。</p> <p>確認した環境は以下の2つです。</p> <ul> <li>Windows 10, Chrome 59.0.3071.115</li> <li>macOS Sierra 10.12.5, Chrome 59.0.3071.115</li> </ul> <p>フォントファイルは<a href="https://www.google.com/get/noto/">Google Noto Fonts</a>で「Noto Sans CJK JP」で検索してダウンロードし、インストールしました。</p> <p>インストール後、WindowsのコントロールパネルとmacOSでバージョンを確認したところ1.004でした。</p> </body>