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

PHPz
リリース: 2024-07-17 06:28:49
オリジナル
756 人が閲覧しました

状況

現在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 をデフォルトとして使用する必要があると思います。

乾杯。良い一日をお過ごしください!

以上がWebページで使用されているフォントを確認するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!