• 締切
  • すぐに回答を!

ホームページのWindowsに表示される画面サイズ

  • 質問No.2286929
  • 閲覧数332
  • ありがとう数1
  • 回答数3

お礼率 59% (19/32)

ホームページを作成していますが、作っているページがフルサイズで
でしか、表示されません。(左側にお気に入りのウインドウを表示した
ままだと、画面が切れてしまう)
画像が切れずに、小さいウインドウのときでもジャストサイズで
表示されるHTMLタグが分りません。
ご存知でしたらおしえてくださいませ。

回答 (全3件)

  • 回答No.3

ベストアンサー率 39% (78/200)

#1です。
再度確認しますが、「画面全体にコンテンツが表示されず、横スクロールが表示される(右端が見えない)」という状況で合っているのですね?
以下、その前提で話を進めます。

> タグが見つかりません・・・
タグというより、CSSですね。
ブロックレベル要素にCSSの width, margin, paddingセレクタ を指定すれば良いと思います。
# #2 の方の仰るように、画像が主体のコンテンツ(画像がウインドウ幅を決定する主要な要素)なら、
# 画像の使い方を変えないとリキッドレイアウトは出来ません。

1. ブロック幅を "width: 30%" のような相対値で指定する
2. "width: 20px" のような絶対値で指定してから、後で残りのブロック要素を消費する
3. "margin: 10em; padding: 5em" のように、マージン,パディングを指定して中身の幅は余った部分とする

私は 3. を好んで用います。
注意しなければならないのは、画像は横幅を絶対値で指定する事です。

<div style='width: 30%'><img width='800' height='600' src='test.png'></div>

上のケースでは、画像の横幅がブロック幅を超えてしまう可能性があります。
大きな画像は使わないように注意して下さい。
(画像も背景画像として使うなら、ウインドウの大きさに依存せずに使えるんですけどね。[並べて表示] になりますから。)

# リキッドレイアウトの場合は、px よりも em の方が好まれる(文字主体のコンテンツと相性が良い)傾向がありますが、
# em は相対値なので画像との相性が悪い事もあります。
# その辺は、ケースバイケースなので柔軟に対応して下さい。

# 要素を横に並べる float はあまり使わない方が良いです。
# 従って、同様の動作を示す align属性も控えめに。(alignは非推奨属性ですしね)
  • 回答No.2
現在のソースやCSS、画像のサイズが解らないとなんとも言えませんが、画像を無視(画像の横幅は基本的には伸縮しないため)した場合、CSSや属性で要素の横幅を絶対値で指定したり、行の多い表を入れていたり、半角英数字をスペース無しで書き続けない限りウインドウの有効範囲で調整されて横スクロールバーが表示されにくくなっているはずです。

こんなことを考えると画像が原因で横スクロールが出ていると仮定すると対処は難しいと思います。
画像の横幅を300px位に納めて見るとか、画像のwidth、heightを止めてCSSで%を単位にして横幅だけを指定すると望むようなレイアウトになるかもしれません。

基本的にブラウザは横スクロールを出しにくくなっていますので出る場合は自分で出している場合が多いのでCSSを見なおすか画像のサイズを見直すなどすると改善されますよ。

例えば
<html>
<head>
<title>**</title>
<head>
<body>
<p>
<img src="a.gif" width="50" height="50" alt="あ">
あああああああああああああああああああああああああああああああああああああああああ</p>
</body>
</html>
このように書けばほとんど横スクロールがでることはないと思います。
これに横スクロールを出すにはimgのwidthを1000にすると出てきますしpにstyle="width:1000px"を入れても出てきますよ。

だから何もしないと横スクロールは出ないものです。
  • 回答No.1

ベストアンサー率 39% (78/200)

「切れる」というのが今ひとつ分かりませんが、画面全体にコンテンツが表示されず、横スクロールが表示される(右端が見えない)という事でしょうか?
そういう場合は、リキッドレイアウトにすれば良いかと思います。

Google検索: リキッドレイアウト
http://www.google.co.jp/search?ie=euc-jp&lr=lang_ja&num=30&q=%a5%ea%a5%ad%a5%c3%a5%c9%a5%ec%a5%a4%a5%a2%a5%a6%a5%c8

リキッドレイアウトというのは、ブロック幅を「相対値で指定」or「絶対値で指定して、どこかで余りを消費する」という形にして
ウインドウ幅に依存せずに、コンテンツを表示するテクニックです。
お礼コメント
megggmint

お礼率 59% (19/32)

ありがとうございます。
そうですね。画面サイズに左右されずに表示されるHTMLタグ・・・
これはリキッドレイアウトしかないんですかね・・・
画面表示を可変に・・って言うのでしょうか。
タグが見つかりません・・・
投稿日時:2006/07/20 01:12
関連するQ&A

その他の関連するQ&Aをキーワードで探す

ページ先頭へ