要素に適用されている実際のフォントを知るには?

投稿者: Anonymous

CSS の font-familyプロパティ について、こちら

font-familyプロパティは、フォントの種類を指定する際に使用します。

フォントの種類はカンマ( , )で区切って複数の候補を並べることができます。 複数の候補を記述しておくことで、先に記述した順にユーザー環境で利用可能なものが選択され、 より多くのユーザーに対して自分のイメージに近いフォントで表示させることができます。

指定したフォントがユーザーの環境にインストールされていない場合には、ブラウザで設定されたデフォルトのフォントで表示されます。

と記載されており、ブラウザやユーザー環境により選択されるフォントが異なることはわかるのですが、具体的にどのフォント(フォント名またはフォントの種類)が適用されているかを知る方法はあるでしょうか?

JavaScript で不可能であればブラウザの開発ツールでも構いません。

追記:Chrome と FireFox は開発ツールで確認できることが分かりました。
IE、Operaでも確認できる方法があればお願いします。

解決

Chromeの開発者ツールでStylesの右にあるComputedの一番下にRendered Fontsがあります。
実際に自分が使っている環境のものしか確認できませんがこれでどうでしょうか?

rendered Fonts

回答者: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *