
No.4ベストアンサー
- 回答日時:
<img>は空要素のインライン要素ですから、body内にそのまま置けません。
必ず仕様書を見ましょうね。
<!ELEMENT BODY O O (%block;|SCRIPT)+ +(INS|DEL) -- document body -->
--- 7.5.1 BODY要素 ( http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401 … )
★BODYには、%block;(ブロック要素)とSCRIPT(スクリプト)が+(一つ以上) +および(INS|DEL)以外は入れられないと明記してある。
そして、
<!ELEMENT IMG - O EMPTY -- Embedded image -->
空要素であり、インライン要素です。
よって、body直下に置く場合は、必ずブロック要素内に置かなければなりません。たとえば<p></p>で括るとか・・・
ですから、
<body>
<h1>見出しレベル1</h1>
<img src=""???>
は間違い、それも最も基本的な間違いです。
<body>
<h1>見出しレベル1</h1>
<p>
<img>
</p>
と書かなければなりません。
^^^^^^^^^^^^^^^^^^^^^^^^^^^
<p>は段落を示すブロック要素で内部にインライン要素以外は含むことが出来ません。</p>は省略できますが、XHTMLを考慮すると省略しないほうが望ましい。
<br>は強制改行
<!ELEMENT BR - O EMPTY -- forced 行区切り -->
であって、段落区切りとはまったく異なります。
【引用】____________ここから
BR要素は、現在のテキスト行を強制的に区切る(終了させる)。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Paragraphs, Lines, and Phrases (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
行間を空けるために<p></p>を使い、そうでない場合は<br>を使うのは、基本的な誤りです。スタイルシートで段落間のスペースは調整しましょう。
【引用】____________ここから
P要素は、1つの段落を表し、P要素自体を含め、ブロックレベル要素を内容とすることはできない。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[Paragraphs, Lines, and Phrases (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
★HTMLを学ぶとき、最初に学ぶのは、ブロック要素とインライン要素の違いです。その説明を端折っているサイトや本は捨ててしまいましょう。
とりあえず、こちらのサイトあたりで正しいHTMLの書き方を身につけましょう。
はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ )
No.9
- 回答日時:
No.6 ORUKA1951です。
先の回答は訂正します。
DTD確認してみました。
確かに、Transitinalではエラーではないですね。・・すみませんでした。
No.8
- 回答日時:
正しいかどうかは、採用している文書型によります。
次の文書型定義(DTD)に当たってみました。
DTDは、テキストエディタで開くことができます。
上はHTML4.01 Transitional、下はHTML4.01 Strict用のDTDです。
http://www.w3.org/TR/html4/loose.dtd
http://www.w3.org/TR/html4/strict.dtd
まず、Transitionalから。
body要素は次のように定義されています。
<!ELEMENT BODY O O (%flow;)* +(INS|DEL) -- document body -->
body要素は、flowが0回以上出現してよい、という意味です。
flowは次のように定義されています。
<!ENTITY % flow "%block; | %inline;">
ブロックとインラインのどちらかが出現しなければならない。
まとめると、body要素にはブロックとインラインのどちらかが出現してよい、という意味です。
したがって、<body><p><img></p></body>や<body><img></body>という書き方は、どちらもHTML4.01 Transitionalの仕様として正しい、ということになります。
次に、Strictです。
body要素は次のように定義されています。
<!ELEMENT BODY O O (%block;|SCRIPT)+ +(INS|DEL) -- document body -->
body要素は、ブロックかスクリプトが1回以上出現しなければならない、という意味です。
img要素はブロックでもスクリプトでもないので、<body><img></body>という書き方は、HTML4.01 Strictの仕様として間違い、ということになります。
また、<body><p><img></p></body>という書き方が、HTML4.01 Strictの仕様として正しい、ということになります。
(ブロックであれば、p要素でなくても構いません)
なお、XHTML1.0の場合も同様の理由により、Transitionalであれば正しい、Strictであれば間違い、ということになります。
(提示されたソースを見ると、XHTMLっぽいですね)
XHTML1.0のDTDは、次になります。
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
No.7
- 回答日時:
規約違反に相当する可能性が在りますがちゃんと認識しなければ行けない事なので・・・
検証1サイト
http://validator.w3.org/
検証2サイト
http://openlab.ring.gr.jp/k16/htmllint/htmllint. …
で以下のソースを検証して見ましょう。
<?xml version="1.0" encoding="Shift_JIS"?>
#1
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=shift_jis" />
<meta http-equiv="content-style-Type" content="text/css" />
<meta name="check" content="確認" />
<meta name="keywords" content="check" />
<meta name="description" content="check" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="pragma" content="no-cache" />
<title>check</title>
<link rev="made" href="mailto:yahoo@yahoo.co.jp" />
<link rel="next" href="index2.html" />
<link rel="stylesheet" type="text/css" href="css.css" />
</head>
<body>
<#2>(開始)
<img src="img.jpeg" alt="img" title="img" width="1" height="1" />
</#2>(終了)
</body>
</html>
例ではXHTML 1.0として、#1にはStrictとTransitionalのどちらかの記述を。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitio …
#2にはStrictの場合はブロックレベル要素を入れ(divやp等)、Transitionalの場合には入れないで省略。
(検証用に入れるのと入れないので作成。)
※StrictでもTransitionalでも入れたソースと入れないソースを作る。
コレを4つのファイルにして上記の検証で実行。
Strictの場合はブロックレベルの要素で囲まないとエラー。
Transitionalの場合はどちらでもエラーは確認されない。
仕様書を引用したり、仕様書を信望するのは構わないが、HTMLの仕様勧告してるw3cでTransitionalの場合ドチラでもエラーを返さないのは「構文」が正しい事を意味する。
検証1サイトよりも検証2サイトの方が厳格に構文チェックするのにも関わらず、エラーは一切無い。
拠ってimgはStrictの場合はブロックレベルで囲む。
Transitionalの場合はどちらでも構わない。
コレが現実的な回答です。
No.6
- 回答日時:
置いておこうかとは思ったのですが、やはり今後このスレッドを見られた方が間違わないように補足だけ
<img>はinline要素なので、Strict(厳密型)もTransitional(移行型)も、body要素には入れられません。いずれもエラーになります。(が、ブラウザは、エラーを無視して表示するように定められています。)
StrictとTransitionalの違いは、
【引用】____________ここから
HTML 4.01移行型DTD。 これは、厳密型DTDのすべての要素・属性に加えて、推奨しない要素や属性も含む(推奨しないもののほとんどは視覚的プレゼンテーションに関わるものである)。
 ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ここまで[The global structure of an HTML document (ja)( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )]より
という推奨しない要素や属性も使えるというだけで、文法まで許しているわけではありません。
詳しくは、3.3 HTML DTDの読み方 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html4 … )をご覧ください。
No.3
- 回答日時:
HTMLにも色々規格があって、厳格な規格ではbody直下に置くことは文法違反です。
http://openlab.ring.gr.jp/k16/htmllint/htmllint. …
こちらでHTMLの文法チェックをすると
http://openlab.ring.gr.jp/k16/htmllint/explain.h …
こんなエラーとなる事があります。
No.2
- 回答日時:
<h2>はタイトル
というより、「見出し=大きな文字」です。一般に言うタイトルとは<title>タグです。
<p>は段落(文章?)
<p>は単独で使用して段落です。</p>は不要。ただし<br>より大きな段落です。
<img>は????
画像です。
>正確にはimgタグも<p>とかで囲わなければいけないのか?
そんなことはありません。
No.1
- 回答日時:
文法的にはどちらでも
images/hoge.gifがhogehogehogehogehogehogehogeと関連する画像なら<p>内に入れておくべきだろうし
関係なくて段落分けするなら入れない
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- PHP タグの追加 1 2022/08/19 11:25
- その他(開発・運用・管理) フォルダの中にファルダを作成してファイルを格納するバッチコマンド 1 2022/06/30 11:39
- Perl 画像が表示でnull; this.src 1 2022/04/19 11:31
- HTML・CSS 【HTML】【CSS】【Swiper】 元の画像は横1200×縦600なのですが、実際のサイト上に反 5 2022/07/16 13:57
- PHP 共通の処理をまとめる方法がわからないのでアドバイスお願いします。 1 2022/12/19 20:20
- JavaScript html5に変えるとスライドショーが消えてしまった。 3 2022/03/26 19:53
- HTML・CSS CSSのホバーエフェクト 1 2023/06/19 06:53
- その他(開発・運用・管理) バッチファイルで特定のファイル・ディレクトリ以外を削除する方法について 4 2022/05/31 14:03
- PHP PHP・Wordpress preg_replaceを条件分岐で処理させる方法が知りたい 1 2023/05/01 14:25
- HTML・CSS flex の各子要素を横幅 100% にしたい 1 2022/09/22 21:25
関連するカテゴリからQ&Aを探す
おすすめ情報
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
含む含まないという概念自体の...
-
テキストボックスの中にリンク...
-
smallにtext-allignが効かない
-
tdに対してmin-heightの定義、...
-
HTMLページ上でiframeを最前面...
-
aの中にspan
-
CSS:overflow要素の印刷について
-
質問1.
-
メールアドレス(グループ)の...
-
HTML の繰返し法???
-
教えてください~タグ~
-
<div>でレイアウトすると上下に...
-
ノンアルコールビールを飲むと...
-
ホームページビルダー16の属...
-
"A style=" のタグの意味を調べ...
-
html タグの閉じスラッシュ前の...
-
<DIV>タグは何の略ですか?
-
スタイルシートで文字色を指定...
-
input type="hidden"で取得した...
-
imgタグをそのまま使うことは正...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
含む含まないという概念自体の...
-
角丸画像の背景色を透明にした...
-
改行ほどは行かないけど、若干...
-
input type="hidden"で取得した...
-
CSSで改行後の行間調整
-
質問1.
-
smallにtext-allignが効かない
-
テキストボックスの中にリンク...
-
CSS:overflow要素の印刷について
-
【ヒトの神秘】美男美女から何...
-
aの中にspan
-
textareaの幅を画面と合わせたい
-
HTML の繰返し法???
-
html タグの閉じスラッシュ前の...
-
HTMLページ上でiframeを最前面...
-
下線と文字の間を調整するには...
-
figcaption要素の中にul要素
-
メールアドレス(グループ)の...
-
emとstrongの反対
-
ある要素の中身を全部グレーア...
おすすめ情報