現在HPを制作しています。
IE8でHPを表示し、文字を拡大すると、
「あるPCでは文字が大きくなり改行して表示されます。そして、改行したときに行間が詰まって表示されます」
「あるPCでは拡大されずにそのままの大きさで表示されます」
どちらもIE8(バージョンは同じ)です、OSは確認しておりません。
私的にはPCに搭載しているフォントが原因かと考えていますが、web初心者のためとても苦戦しています。
まだアップしていないのでサイトを載せることができないのですが、同じ様な現象を知っている方いらっしゃれば、解決方法を教えていただけたら幸いです。
分かりづらい文章があれば補足させていただきます。
よろしくお願いいたします。
fontのcssは
*{
color: #333333;
font-size: 12px;
line-height: 18px;
text-decoration: none;
margin: 0;
padding: 0;
word-wrap:break-word;
}
font-familyは
"メイリオ",Meiryo,"MS Pゴシック", Osaka,sans-serif;
hタグのcssは
h2 {
color: #8fc42a;
font-size: 15px;
font-weight:bold;
margin:11px 0 8px 0;
}
になります。
よろしくお願いします。
No.1ベストアンサー
- 回答日時:
ピクセルで指定している場合、そのような現象がでる原因としては利用環境のブラウザの設定があげられます
MAC環境でののエクスプローラ-・Windowsのエクスプローラのユーザー補助が設定されている場合、
HP製作者の意図で文字サイズを意図的に固定させることはできません。
詳しくはコチラのベストアンサーをご確認下さい
http://questionbox.jp.msn.com/qa896446.html
行間がつまってしまう不具合を解消するなら、h2のCSSに別途line-heightをemで指定すれば解消されると思われます
h2 {
color: #8fc42a;
font-size: 15px;
font-weight:bold;
margin:11px 0 8px 0;
line-height: 1.8em; ←こんな具合 指定されたフォントサイズに対して1.8文字分の行間 数値は調整してください
}
回答ありがとうございます。
ずばりこのことでした。
しかも、対応策まで教えていただけるなんて。
本当にありがとうございます。
基本的なことなど分からないことが多いのでこれからもっと勉強をしなければなりませんね。
回答ありがとうございました。
No.2
- 回答日時:
全称セレクタ(Universal selector)での指定は止めたほうが良いです。
どこかのオーサリングツール由来ですが、ウェブの基本はユーザー優先です。*を使うと、すべてのセレクタについていちいち設定しなければならない。可能な限りユーザー側に任せること。せいぜい
body{color: #333333;font-size: 12px;font-family:・・・}
でやめておく。これらは基本継承される。
特にmarginは*で指定しないほうがよい。dl,block,p,・・などすべて設定しなおさなきゃならない。オーサリングの手抜き・・たまったもんじゃない。
それでもユーザーはデフォルトのフォントサイズを決めていることもあるので期待しないこと。
追記するfont-sizeは、%のほうが良いでしょう。pxだと解像度によって変化する。私はemやexが多いですが・・
h1{font-size:150%;}
h2{font-size:130%;}
h3{font-size:120%;}
h1,h2,h3,h4{margin:11px 0 8px 0;line-height:2ex;}
とか・・
回答ありがとうございます。
独学なので基本的なことが分かっていないことが多く、とても参考になりました。
後で、検索して深く勉強したいと思います。
回答ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS アコーディオンメニューが思うように動作しません。 1 2023/08/20 16:48
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- オープンソース cssで中央寄せ 1 2023/05/19 06:25
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- HTML・CSS CSSがなぜかfont-sizeだけ効かない...記述がまちがっているんでしょうか 5 2022/04/09 17:52
- HTML・CSS テキストを画面の真ん中に配置したいです。 2 2022/11/25 16:11
- PHP アンドロイドスマホでのphp echoの文字サイズ 1 2023/05/13 15:15
- HTML・CSS スマホ表示用のwebページ、style.cssでは表の中の文字 font-size は指定できない? 1 2023/03/27 18:57
- JavaScript vertical sliderをautoplayしたい 2 2022/08/25 14:47
- HTML・CSS テーブルタグのセルの幅の一部だけを指定 1 2023/03/12 12:02
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
fontサイズ指定の ”-(マイナ...
-
HTMLで特定の文字だけ色を変え...
-
全角半角含めて等幅で表示したい
-
文字の位置、上下のマージンが...
-
指定の文字だけ色を変える
-
CSSを一部無効にしたい
-
WEBサイトの作成で、imgタグに...
-
Htmlとcssの勉強のため手書きで...
-
CSSについて教えてください。 ...
-
上付き文字と下付き文字を同時...
-
テキストボックス途中で切れて...
-
外部CSSファイルで未定義のclas...
-
a:hoverの下線指定が反映されない
-
特定の文字のみcssを適用するに...
-
テキストファイルの行を指定し...
-
アコーディオンメニューが思う...
-
リンク文字
-
FONTを指定できない
-
HTMLの効力が発動しない!
-
CSSでfont-size、pxの絶対値、...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
リストの前後の行間をなくす方...
-
特定の文字のみcssを適用するに...
-
リンク文字
-
文字の位置、上下のマージンが...
-
Format 関数 表示書式指定文字...
-
テキストファイルの行を指定し...
-
API Sleep関数について
-
テキストエリア内の文字の装飾
-
CSSを一部無効にしたい
-
fontサイズ指定の ”-(マイナ...
-
ホームページビルダー作成HPがi...
-
全角半角含めて等幅で表示したい
-
CSSについて教えてください。 ...
-
<input type="file"> の幅
-
background-color: #ddd;の意味...
-
上付き文字と下付き文字を同時...
-
h1タグのパンくずリストへの設置
-
Excel VBA メール作成について ...
-
Excel VBA メール作成について ...
-
指定の文字だけ色を変える
おすすめ情報