HP閲覧時にフォントサイズを大きくすると0.9emの方が1.0emより大きく見える理由は?

このQ&Aのポイント
  • ホームページのフォントサイズを大きくすると、0.9emの方が1.0emより大きく見える理由について教えてください。
  • ホームページのフォントサイズを変更した際、注釈部分のフォントサイズが本文よりも大きくなってしまう現象について、解決策を教えてください。
  • 相対指定をしたままで注釈部分を少し小さく見せるための方法について教えてください。
回答を見る
  • ベストアンサー

HP閲覧でフォントサイズを大にしたら0.9emの方が1.0emより大きく見えます

私のホームページでは外部CSSでフォントを1emと指定しています。 本文の中で注釈をつけていて、その部分ではインラインCSSで<span style="font-size:0.9em;">と少し小さくしています。 通常私自身のIE設定は文字のサイズを中にしているのですが、ある時閲覧サイズを大にしてみました。すると少し小さい筈の注釈部分が逆に本文のフォントサイズより大きくなって見えます。 フォントを全てピクセル指定すれば比率は維持出来るはずですが、エム指定は続けたいのです。 相対指定をしたままで文字サイズに拘わらず注釈部分をすこし小さく見せる為にはどうしたら良いでしょうか。よろしくお願いします。

noname#96725
noname#96725

質問者が選んだベストアンサー

  • ベストアンサー
  • crepon133
  • ベストアンサー率51% (399/776)
回答No.1

%指定はいかがでしょうか font-size:90%; あるいは font-size:x-small;

noname#96725
質問者

お礼

crepon133さん、おはようございます。 どちらも使った事がありませんでした。 両方試した結果、x-smallで文字間を1ピクセル詰めたらイメージ通りのものが出来ました。ついでに外部CSSで一括管理する事にしました。 有り難うございました。 又お付き合い下さい。

関連するQ&A

  • フォントサイズをemで指定すると太字になってしまう。

    CSSで たとえば、 font-size:1.2em; と指定し、ブラウザ(IE6)で表示させます。 ブラウザの文字サイズが「中」のときは 問題ないのですが、「最大」にすると その文字が太字になっているのですがどうしてですか?太字にしたくないのです。 また、0.9emにして、「最小」表示させると ごま粒みたいな文字になってほとんど判読不可能です。 「最小」から「最大」まで変えても、きちんと読める HPにしたいと思っていますが、 いまはしょうがないのでfont-sizeは指定していません。 emがうまく使いこなせません。 こんなことで悩んでいるのは自分だけでしょうか。

    • ベストアンサー
    • HTML
  • font-size emと%の違い

    いつもお世話になっています。 早速ですがcssでfont-sizeを指定する場合、emと%の違いを教えて頂きたいのです。 ぶっちゃけて言えばemと%、どちらで指定するのがいいのでしょうか? 自分なりに調べてみたところ、emは親要素のフォントサイズを1とした相対指定、%は親要素のフォントサイズを100%とした相対指定とありましたが、それなら全く違いはないと考えていいのでしょうか? IEだと違って見えるという情報もありましたが、これはかなり古い情報ですので現在では改善されているのでしょうか? 文字コードによって違いが出るという話も聞きましたが、本当でしょうか? ちなみに今はUTF-8で作成しています。 どうも明確な違いというのがイマイチよく分かりません。 現在使用されているブラウザでUTF-8のサイトを見た場合なら、どちらが向いているのか教えて下さい。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • font-size: 0.1emの意味は?

    movable typeでブログを立ち上げようと思っています。 cssを書き換えているんですが、「font-size: 0.1em」の意味はわからなくて困っています。 「font-size: ○px」とはどう違うのでしょうか? フォントサイズをより小さくするにはどうしたらよいのでしょうか?

  • CSS) emでのサイズ指定

    CSS初心者です。 何のサイズをem単位で指定できるのか調べたくて、適当に h1,h2,h3,h4,p { font-size: 2em; margin: 1em; padding: 1em; margin-border: 1px; border-color: #000000; ligh-height: 1em; border-width: 1px; } としました。 すると、すべてのフォントサイズが同じになりました。 それぞれのヘディングが倍のサイズになると思っていたのですが、なぜこうなってしまったのでしょうか? また、マージンのサイズ、パッデイングのサイズを視覚的に確認したいのですが、どうすればいいのでしょうか?

    • ベストアンサー
    • CSS
  • CSS font-sizeのパーセンテージ指定「管理がややこしくないですか?」

    色々実験しているのですが、、、 CSSでフォントサイズを「%」指定すると、サイズの基準になるのはひとつ前の親要素のフォントサイズになるみたいですね。 ============ <div style="font-size:80%">あああ<span style="font-size:100%">いいいい</span>あああ</div> ============ 上記の場合「いいい」のサイズは「あああ」に指定している「80%」を継承し、基準値となるので「いいい」と「あああ」のサイズは変わらない。 「いいい」をブラウザデフォルトの16px相当のサイズで表示しようとすると、「<span style="font-size:130%">いいいい</span>」にしなくてはいけないようです。(少なくとも自分が実験した限りでは・・・) 親要素どころか、先祖要素なんかも影響してくることを考えるとテキストサイズを「%」指定することはとてもややこしいことでは無いですか?どのように管理されていますか? 最近は文字サイズはpx等の固定ではなく、相対指定するのが望ましいと言われているので「%」で指定していこうと思っているのですが。 基本的な質問ですみません。 ※質問しやすいように「style」直接記述をしていますが、普段はCSSファイルをhtmlに読み込みしています。

    • ベストアンサー
    • HTML
  • font-family、font-sizeについて

    こんばんは。 今自分のサイトを作っているのですが、普通にCSSでフォントの種類(font-family:英数字だったら○○、日本語だったら○○など)・大きさ(font-size:ピクセルかパーセント)などはどのように指定をするのが一般的でしょうか?

  • font-sizeについて

    ブログのレイアウトを私オリジナルのものに変えたくて、今のCSSの記述を読んでいたのですが、よくわからない記述がありました。 /*---------- CSS部分 ----------*/ body { background-color: 背景色; color: 文字色; text-align: center; font-family: フォントの種類; font-size: x-small; voice-family: "\"}\""; voice-family: inherit; font-size: small; } わからない点は1点です。 1、上記でまず、「font-size: x-small;」と指定してあるのですが、最後に「font-size: small;」と指定しなおしています。これはどのような意味があるのですか? なぜ2回も指定しているのでしょうか? すいません、ご教授よろしくお願いします。

    • ベストアンサー
    • CSS
  • CSS・フォントサイズ変更は どこをいじれば?

    ホームページビルダー17で、以下のサイトのテンプレートをダウンロードして編集中です。 http://nikukyu-punch.com/template/giin1_pink/index.html 本文部分の文字が小さいのでもう少し大きくしたいのです。 これまではテーブルタグで作っており、CSSは初心者です。 文字部分を右クリックしてスタイルの設定を見ると 本文や見出し部分などのfont-sizeが100%だったり75%だったりします。 たぶんCSSのfont設定が細かく分かれているのでしょうが… あまり細かく分類せず、右のサイドメニューと本文の文字の大きさを font-size : 14px line-height : 150% にしたいというのが希望です。 このようなスタイルの設定の変更はどうすればいいのでしょうか。 スタイルシートマネージャーから変更すればいいのでしょうか? 一度スタイルを削除すると戻せないようなので、なかなか試行錯誤に踏み出せません。 画像などは変更できたのですが。 ご教授願えませんでしょうか?

  • CSSで文字指定:あるセレクタで指定した値を他のセレクタへ継承させることは出来ますか?

    文字サイズをCSSで指定する方法についての質問です。 同一の文字サイズ指定でも、OS・ブラウザ間で表示にギャップがあります。 そのギャップを調整するために、JavaScriptを使用して OS・ブラウザごとにそれぞれ異なった外部CSSファイルを読み込むようにしています。 macintosh.css windows.css windowsIE.css ...このような振り分けCSSファイルでそれぞれ文字サイズ指定をしています。 CSSファイルの中身は、 macintosh.css .small { font-size: 10px; } /* 小さめ */ .middle { font-size: 12px; } /* 中くらい */ .large { font-size: 14px; } /* 大きめ */ windowsIE.css .small { font-size: 0.8em; } /* 小さめ */ .middle { font-size: 0.9em; } /* 中くらい */ .large { font-size: 1em; } /* 大きめ */ ...といった具合です。 このやり方では、h2の文字サイズを全て中くらいの大きさに指定したい場合、 全てのh2タグに <h2 class="middle"> と記述することになってしまいます。 これは煩雑なので一括指定したいと考えます。 すぐ思いつく方法は、振り分けCSSファイルにh2の文字指定も含めることです。 macintosh.css h2 { font-size: 12px; } windowsIE.css h2 { font-size: 0.9em; }  ...のようなことです。 そうではなく、h2に .middle(=中くらい)で指定した文字サイズをそのまま受け継がせる方法はないでしょうか? h2 { class="middle" } 変な書き方ですが、意図を汲み取っていただけるでしょうか。 このように指定出来れば、かなり省力化出来るように思います。方法があればぜひお教え下さい。

    • ベストアンサー
    • HTML
  • CSSでfont-size、pxの絶対値、相対値に

    CSSでfont-sizeを指定するとき、font-sizeを継承する相対値と絶対値があり、%やemが相対値なのは分かりますが、pxはどちらになりますか?絶対値だと思っていたのですが、相対値と書かれているものをちらほら見たので気になりました。

    • ベストアンサー
    • HTML

専門家に質問してみよう