No.5ベストアンサー
- 回答日時:
私もNo.2-3様のご指摘の通りだと思いますが。
参考にされているソースの信頼度によってはhtmlやbodyに対するそれらの指定を「何となく」やってるだけの可能性もないとは言えないのでは…具体的なソースを見ていないので、明言は避けますが。自分が制作する上ではそういう指定をする必要性に迫られた事はないですね、今のところ。
そもそも、"width: 100%;"というのは「直近の親要素の幅に対する100%」です。html要素は「ルート要素(最大の親要素)」であり、それより上位の親要素は存在しないので、ディフォルトの幅はウィンドウサイズ全体と考えて良いのですから、そこに100%を指定してもただ無意味なだけだと思いますが。
ちょっと気になる発言があったので以下はそれについての蛇足ですが…
htmlやbody要素に何も幅が指定されていなくても、bodyの直接の子要素に位置するコンテナブロックであればディフォルトもしくはその要素へ直接"width: 100%;"を指定してもその横幅は画面サイズ一杯に広がりますよ。
----------------------------------------------------------------------
【HTML】
----------------------------------------------------------------------
<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<link href="css/sample.css" type="text/css" rel="stylesheet" media="all" />
<title>サンプル</title>
</head>
<body>
<div id="hoge1">
幅無指定のボックス
</div>
<div id="hoge2">
幅100%で指定のボックス
</div>
</body>
</html>
----------------------------------------------------------------------
【CSS】
----------------------------------------------------------------------
body {
margin: 0;
padding: 0;
background: #fff;
}
div#hoge1 {
background: #fcc;
}
div#hoge2 {
width: 100%;
background: #ccf;
}
----------------------------------------------------------------------
上記では、hoge1(widthの値はディフォルト)もhoge2(widthの値は100%)でも結果は同じでいずれも「ウィンドウサイズ一杯」の幅でレンダリングされます。
具体例まで記述していただいてありがとうございます!
>参考にされているソースの信頼度によってはhtmlやbodyに対するそれらの指定を「何となく」やってるだけの可能性もないとは言えないのでは…
みなさんのおっしゃる通り、なんとなくなのかもしれませんね^^;
No.4
- 回答日時:
すみません、書き漏れていました。
;正確には、%で指定するために必要な物、だと思います。
例えばボックスの縦幅を、画面いっぱいに広げたい時に
ただ100%と指定しても反映されないのですが、
html,bodyに数値を設定しておけば反映されるようになるのです。
『body hright:100%;』で検索すると色々情報が出てきますので
ぜひそちらをご参考下さい。
>『body hright:100%;』で検索すると色々情報が出てきますので
私自身も色々検索してみたのですが、width:100%;で検索していたため上手く検索できませんでした(汗)。
『body hright:100%;』で調べてみます。
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- HTML・CSS スクロールすると追従する画像のコードを書いているのですが、追従する画像の大きさの調節が上手くいきませ 2 2022/04/18 12:52
- HTML・CSS (Javascript)印刷するファイルに応じて印刷プレビュー画面で用紙を自動的に切り替えたい!! 2 2022/04/11 12:04
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS img と p を縦中央に配置したいのですがうまくいきません。 2 2023/01/12 14:38
- HTML・CSS cssが効かなくて困ってます 1 2023/01/01 23:57
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- HTML・CSS imgとpを縦・横に中央揃えする 1 2023/01/17 11:30
- HTML・CSS html/cssで要素が出てこなくて困ってます 1 2022/12/31 16:59
- HTML・CSS 下にスクロールしても、追従するボタンのコードを書いたのですが、ボタンの中の画像が半分しか表示されない 1 2022/04/16 21:31
- Visual Basic(VBA) 【VBA】写真の貼り付けコードがうまく機能しません。 5 2022/09/01 18:43
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
質問1.
-
タグは大文字と小文字どちらが...
-
親要素・子要素
-
タグの締め
-
アコーディオンメニューの二階...
-
【ヒトの神秘】美男美女から何...
-
超音波で洗脳。
-
角丸画像の背景色を透明にした...
-
2個のFormを横並びにしたい
-
<div align="center">を使わず...
-
inputタグはformタグで必ず囲む...
-
input type="file"の幅と高さ
-
テキストボックスの中にリンク...
-
【C++】Vector、listの要素比較...
-
画像の回り込みと、見出しの背...
-
HTMLです 四角みたいにして中に...
-
取消し線に色を付ける
-
emとstrongの反対
-
HTMLタグ間にはさまない場合に...
-
リンク付き画像を右よりに表示...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
【ヒトの神秘】美男美女から何...
-
smallにtext-allignが効かない
-
含む含まないという概念自体の...
-
還暦を過ぎた方々に質問です。
-
「諸要素」とはどういう意味で...
-
質問1.
-
textareaの幅を画面と合わせたい
-
角丸画像の背景色を透明にした...
-
2個のFormを横並びにしたい
-
テキストボックスの中にリンク...
-
HTMLです 四角みたいにして中に...
-
CSS:overflow要素の印刷について
-
input type="hidden"で取得した...
-
tdに対してmin-heightの定義、...
-
HTMLページ上でiframeを最前面...
-
タグは大文字と小文字どちらが...
-
HTMLです
-
2行にしたい要素、改行か分割...
-
改行ほどは行かないけど、若干...
-
H1タグを画像にしたい
おすすめ情報