サイトのfontの書体とサイズを調べる方法ってありますか。

たとえば
http://bukupe.com/summary/5794

文言:「自分は特別に選ばれて生まれてきた存在ではない」
以下の文字のfontの書体とサイズは、どうやったらわかりますか。

IE→右クリック→ソースの表示

ソースから、推測していくしかないのでしょうか。

よろしくお願いします。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2012/08/18 21:41:01
  • 終了:2012/08/24 10:11:41

ベストアンサー

id:a-kuma3 No.4

a-kuma3回答回数4559ベストアンサー獲得回数19032012/08/19 11:43:51

ポイント50pt

Firefox だと、「要素の調査」というのが、右クリックメニューにあります。
外部の CSS ファイルに定義してあっても、一発で分かるので、スタイルを調べるときに、かなり重宝します。

操作のイメージは、こんな感じです。
f:id:a-kuma3:20120819113138p:image


質問にあげられたページだと、bakupe_base.css で body タグに対する

body{ font: 14px 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', "メイリオ", Meiryo, Arial,Osaka,Verdana,'MS Pゴシック', sans-serif; }

という指定を、reset.css の以下の定義、

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	font: inherit;
}

で、p に対する設定が上書きしている、という感じです。
reset.css の指定が inherit (継承) なので、結局、bakupe_base.css での指定が採用されている、という感じです。

id:kohhi

早速お返事いただき、ありがとうございました。

2012/08/19 12:44:52

その他の回答(3件)

id:maya70828 No.1

楽1978回答回数1364ベストアンサー獲得回数1392012/08/18 21:51:47

id:kohhi

早速お返事いただき、ありがとうございました。

2012/08/19 12:43:48
id:amai_melon No.2

amai_melon回答回数2011ベストアンサー獲得回数472012/08/18 22:21:55

ポイント25pt

フォント名を判別するソフト。ただし、PC内のフォントのみ。

http://www.forest.impress.co.jp/docs/serial/okiniiri/20101005_397137.html

id:kohhi

早速お返事いただき、ありがとうございました。

2012/08/19 12:43:50
id:yvmub No.3

yvmub回答回数100ベストアンサー獲得回数22012/08/18 22:52:41

ポイント25pt

Google Chromeなら文字選択・右クリックで「要素を検証」でフォント名・サイズも確認可能

id:kohhi

早速お返事いただき、ありがとうございました。

2012/08/19 12:43:52
id:a-kuma3 No.4

a-kuma3回答回数4559ベストアンサー獲得回数19032012/08/19 11:43:51ここでベストアンサー

ポイント50pt

Firefox だと、「要素の調査」というのが、右クリックメニューにあります。
外部の CSS ファイルに定義してあっても、一発で分かるので、スタイルを調べるときに、かなり重宝します。

操作のイメージは、こんな感じです。
f:id:a-kuma3:20120819113138p:image


質問にあげられたページだと、bakupe_base.css で body タグに対する

body{ font: 14px 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro', "メイリオ", Meiryo, Arial,Osaka,Verdana,'MS Pゴシック', sans-serif; }

という指定を、reset.css の以下の定義、

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	font: inherit;
}

で、p に対する設定が上書きしている、という感じです。
reset.css の指定が inherit (継承) なので、結局、bakupe_base.css での指定が採用されている、という感じです。

id:kohhi

早速お返事いただき、ありがとうございました。

2012/08/19 12:44:52

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません