「労働者が自分の仕事をうまくやりたいなら、まず自分の道具を研ぎ澄まさなければなりません。」 - 孔子、「論語。陸霊公」
表紙 > プログラミング > Webページで使用されているフォントを確認する

Webページで使用されているフォントを確認する

2024 年 8 月 1 日に公開
ブラウズ:976

状況

現在next.jを勉強中です。次のチーム (https://nextjs.org/learn) が作成したコースを受講しています。

フォントと画像の最適化に関連するセクションがあります。
正直に言うと、私はフォントや、Web ページ上の特定の要素でどのフォントが使用されているかについて、あまり注意を払ったことはありませんでした。
しかし、この教材を読んで、それができることに気づきました。特定の要素でどのフォントが使用されているかを確認できます。ページ上に複数のカスタム フォントを含めることができ、これは便利です。

私はデフォルトのブラウザとして Chrome を使用しているので、devtools を開いて、使用されているフォントを確認しました。

chrome dev tools

これはかなり貧弱で、情報があまりないようでした。

しかし、私はFirefoxでも同じことをしました、そしてFirefoxにはフォントに関してより多くのオプションがあるようです。エディターを使用して、サイズ、行の高さ、間隔、太さを変更できます。これは、特定の要素に最適なフォント プロパティを見つけようとしているときに特に非常に便利です。

Check used fonts on a webpage

私の考え

フォントに関するこれらの発見により、以前レイアウトで問題があったときに、Chrome よりも Firefox の方がはるかに効率的にデバッグできることを思い出しました。
Firefox は FE 開発をより流動的にするために、Chrome よりも CSS に気を配っているようです。次回 CSS 作業を行うときはこれを考慮して、Firefox をデフォルトとして使用する必要があると思います。

乾杯。良い一日を!

リリースステートメント この記事は次の場所に転載されています: https://dev.to/machy44/check-used-fonts-on-a-webpage-29cn?1 侵害がある場合は、[email protected] に連絡して削除してください。
最新のチュートリアル もっと>

免責事項: 提供されるすべてのリソースの一部はインターネットからのものです。お客様の著作権またはその他の権利および利益の侵害がある場合は、詳細な理由を説明し、著作権または権利および利益の証拠を提出して、電子メール [email protected] に送信してください。 できるだけ早く対応させていただきます。

Copyright© 2022 湘ICP备2022001581号-3