以下の内容はhttps://simadzu.hatenablog.com/entry/hatena-huiより取得しました。


はてなブログでふい字を使ってみるテスト

はてなロゴ

はてなブログでふい字(漢字も使える手書き風の日本語フォント)が使える(はてなブログに組み込まれている)ことを知ったので、ためしにこの記事で使ってみました。

FOXISM|はてなブログでふい字が使えたのでメモ風cssを作ってみたを参考に、メモ風cssでふい字を表示しています(画像を使わないでCSSだけで表現できるのがすごい!)。

どこで生れたか頓(とん)と見当がつかぬ。

何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩はここで始めて人間というものを見た。

しかもあとで聞くとそれは書生という人間中で一番獰悪(どうあく)な種族であったそうだ。

この書生というのは時々我々を捕(つかま)えて煮て食うという話である。

Qiita(@oreo)|CSSでwebフォントの読み込みが遅い問題を改善する方法を参考に、ふい字が読み込まれるまでは、ローカルフォント(sans-serif)でテキストを表示するように、CSSで「font-display: swap」を指定しています。

CSS
<style>
@font-face {
   font-display: swap;
   font-family: HuiFontP109;
   src: url(http://hatenablog.com/fonts/public/HuiFont/HuiFontP109.woff) format("woff");
}
</style>

ふい字のファイルサイズが大きい(1.5MB)ので、このページが重かったらごめんなさい。




以上の内容はhttps://simadzu.hatenablog.com/entry/hatena-huiより取得しました。
このページはhttp://font.textar.tv/のウェブフォントを使用してます

不具合報告/要望等はこちらへお願いします。
モバイルやる夫Viewer Ver0.14