- ベストアンサー
終了タグは省略可？
べたうちでHTML言語を使っています。 前の質問で＜P＞タグの＜/P＞は省略可能と回答があります。 ＜div＞や＜ul＞でも省略できるでしょうか？ 今のIEを使っていて正常に表示されています。 他のものでは誤作動を起こしているのでしょうか？
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
その他の回答 (4)
- tracer
- ベストアンサー率41% (255/621)
答えは2つです。 ひとつは、(x)htmlのバージョン、互換方法によっては、終了タグが省略可能になる場合があること。詳細は他の回答者さんのリンクが参考になります。もうひとつは、文法の正誤に関わらず、省略できるブラウザとできないブラウザがあること。です。 正しい文法で書くことは重要ですが、実際のところは、複数のブラウザで表示を確認し、それぞれの挙動に慣れるしか方法がありません。とくにIEは文法を裏切るかなりの問題児で知られています。質問者さんがどういったレベルでホームページをつくられているか分かりませんが、最低でもIE、Safari、Firefox、Opera、Chromeの最新バージョンでの確認はしたほうがよいと思います。各ブラウザをインストールするだけなので、そんなに難しい話ではないはずです。
お礼
ありがとうございます。 趣味で、自分が見る程度のHPです。 →最低でもIE、Safari、Firefox、Opera、Chromeの最新バージョンでの確認はしたほうがよいと思います。各ブラウザをインストールするだけなので これだけはやろうと思います。 参考になりました。
- yyr446
- ベストアンサー率65% (870/1330)
確かにHTMLは、ルールに従っていれば、終了タグの省略、さらには開始タグも省略してもゆるられます。<body>が無くても文法違反にならないケースもあります。 （※知ってるでしょうけど、XHTMLでは省略できません） でも、このルールを考えながらマークアップするのは、かえって面倒です。ですから明らかに自明な単純なケース以外省略しない方がよいです。 例えば、<select>下の<option>られつなんか、</option>を書かないほうが見やすいですよね。 （参考）省略TAG機構 http://bakera.jp/html/sgml/omittag.html http://www1.u-netsurf.ne.jp/~7l1rll/SGMLsec6_0.html#3_1
お礼
ありがとうございました。 HTMLとXHTMLの違いがわかりました。
- otaku37564
- ベストアンサー率38% (1160/3007)
どんなページを作っているかはわかりませんが <div>タグを閉じなければ 永遠にそのタグの設定を引き継いでしまうと思いますけど？ パディングも何もあったもんじゃないものが出来ますね。 DIV要素を並べる必要のないほど単純なページでしょうか？ IE以外で見たらとんでもない方向に文字が羅列しているページになりそうですね。 プロの仕事なら絶対にしません。互換性がなくなりますから。
お礼
回答してくださったことには、お礼を申し上げますが。 あなたの回答は参考になりません。 →ページになりそうですね。 そんな憶測でものを言ってるあなたもプロじゃないでしょ？
- D-Matsu
- ベストアンサー率45% (1080/2394)
IEはHTMLエラーを勝手に補完しますから、「IEで意図通りに表示されるからHTML記述として正しい」とは言えません。 むしろ「HTML通りに表示しない」だけたちが悪いとも言えます。 IE9ではこの機能がなくなるという話もあるので閉じタグは付ける癖を付けておいた方がいいでしょう。
お礼
ありがとうございました。 IEの性質がよくわかりました。
関連するQ&A
- 開始タグと終了タグについて
開始タグと終了タグについて ものすごく初歩的な質問で失礼します。 <div id="container"> <div id="header"> </div> <div id="menu"> </div> <div class="main-top-img"> </div> <div class="main-middle-img"> <div id="main-contents"> <div class="text"> <h2 class="title"></h2> <p class="text"></p> <h3 class="subtitle"> <p class="text"></p> </div> </div> <div class="main-bottom-img"> </div> <div id="footer"> </div> </div> などいのように開始タグと終了タグの間に、他の多くの<div>要素がある場合、どこがその要素の終了タグなのか分からなくなります。 それぞれの開始タグが、それぞれの終了タグと対応するのは、どのようなルールのもとに決定されているのですか？？
- ベストアンサー
- HTML
- イメージタグはタグで囲むべき？
CSSを使ってサイトを作成しています。 気になった事があったので質問させてください。 テキスト（文字）を入力する祭は、<p>～</p>・<div>～</div>等のタグで囲むかと思います。 <img src="" width="" height="" alt="" /> 上記のようなイメージタグは、<p>～</p>・<div>～</div>等で囲む必要はあるのでしょうか？ 囲まなくてはいけないものなのでしょうか？ <p>～</p>・<div>～</div>タグにスタイルをつけていなければ、 囲んでも囲まなくても表示は変わりませんが、HTML的というか文法的に囲むべきなのでしょうか？ ※<p>タグは「reset.css」で上下改行なしにしてあります。 宜しくお願いします。
- ベストアンサー
- CSS
- menuのHTMLタグとCSSが上手くいかない
画像(1)が現状です。イメージは(2)です。何故HTMLタグを別々にするかというとスマホにしたらsubメニューをボトムに配置したいのです。 メニューとsubメニューの背景がくっつかないのです。 (1)を(2)にするにはどうすれば良いでしょうか？ 以下がHTMLタグとCSSになります。 アドバイスをお願いします。 HTMLタグ <div class="div1"><ul><li>メニュー1</li><li>メニュー2</li><li>メニュー3</li><li>メニュー4</li></ul></div> <div class="div2"><ul><li>sab1</li><li>sub2</li></ul></div> CSSスタイル ul li { list-style: none; } .div1 { background: #ccc; float: left; } .div2 { width: 240px; background: #999; float: right; } li { float: left; padding: 5px 15px; }
- 締切済み
- HTML
- divタグ内のコンテンツが重なって表示されてしまう。
下記のようなHTMLを表示させるときに IEでは上下に並んで表示されるのですが、FF、Operaなどでは重なって表示されてしまいます。 どうしたら、上下に並べて表示させられますか？ <div id="a"> <div id="b"> <ul> <li>重なってしまう文字列</li> <li>重なってしまう文字列</li> </ul> </div> </div> <table> <!-- このテーブルタグの上に重なって表示されてしまう --> </table>
- 締切済み
- HTML
- HTMLタグの表について質問です。
HTMLタグを使って表を作って表示させました。 Firefoxでは正常に表示されるのですが、IE6だと表自体は正常に表示されるものの、 表から下の部分が表の右に移動してしまい正常に表示が出来なくなってしまいます。 どなたか回答お願いします。
- 締切済み
- ブログ
- HTMLタグの<body bgcolor="#AAAAAA">等の中の「#」「"」は省略してもいいのでしょうか？
HTMLタグの<body bgcolor="#AAAAAA">等の中の「#」や「""」は省略しても大丈夫でしょうか？ 検証してみても、特に結果は変わらないようです。。 他のタグでも幾つか試してみましたが特に大丈夫でした… それとも、ブラウザによって読み込めなくなるとか、 省略してるとなんかおかしくなる事がおきるのでしょうか？
- ベストアンサー
- ホームページ作成ソフト
- タグを教えてください。
一行の文章を段落おちせずに右側に寄せるタグって何ですか？ また p align と div align の違いがどうしてもわかりません。 ＨＴＭＬ初心なものでよろしくお願いします。
- ベストアンサー
- その他（インターネット・Webサービス）
- floatを適用したdiv内部にあるpタグのmarginについて
floatを適用したdiv内部にあるpタグのmarginについて 現在HTMLとCSSを勉強している者です。 cssのmarginの挙動がいまいち理解できずに困っていたもので、 ご回答いただきたく質問させていただきました。 以下私が作ったサンプルHTMLとCSSです。 ==========HTML========== <div id="test01"> <p>Pタグで囲まれた文章です。</p> </div> <div id="test02"> <p>Pタグで囲まれた文章です。</p> </div> <div id="test03"> <p>Pタグで囲まれた文章です。</p> </div> <div id="clear"> <p>clear: bothです。</p> </div> （<body>前、</body>後省略） ==========CSS========== html, body, div { margin: 0; padding: 0;} p {margin: 10px; padding: 0;} div#test01 {background-color:#EEE; width: 900px;} div#test02 {background-color:#CCC; float: left; width: 650px;} div#test03 {background-color:#AAA; float: left; width: 250px;} div#clear {background-color:#888; clear:both; width: 900px;} 先頭に900pxのdiv（test01）、その下に二つのdiv（test02、03）をfloat:leftで並べました。 最後にclear:bothを行っております。 そして各div内に10pxのmarginを付与したpタグ文字を入力しているのですが、先頭のdivとfloat:leftを行ったdivで、marginの結果が異なってしまいました。 先頭のdivは上下に白い10pxの余白、左はtest01で指定した背景色を残したまま10pxの余白が作られ、float:leftのdivではtest02、03で指定した背景色を残したまま上下左右に10pxの余白が作られています。 このように同じ効果のpタグでも表示が異なってしまう理由は何でしょうか。 また先頭のdivの場合、上下左右に10pxの白または背景色の余白ができるのなら理解できるのですが、何故上下と左右でmargin結果が異なるのか、理由も知りたいです。 おそらくpaddingを併用すれば思った表示にはできると思うのですが、今回はこうなってしまう理由が知りたく質問させていただきました。 また私の記述方法に誤りがあればご指導いただけると助かります。 宜しくお願い申し上げます。
- 締切済み
- HTML
- CSSでのdivタグに付いての質問です。
現在HTMLを学習し始めたばかりで困惑しております。 HTML内の<body>タグ内に<div>タグを作りidを"main"としました。 具体的には<div id="main">Main</div>と記述しました。 そこからCSSで#main {color: red;} と記述しましたが、文字色の変更が全く反映されない状態です。 他の<p>タグや<h1>タグ、また<body>タグは全て奇麗に反映されるのに<div>だけが全然ダメな状態です。 一体何が原因なのか教えて下さい。 初心者すぎる質問だと思いますが、どうぞよろしくお願い致します。
- ベストアンサー
- HTML
- タグを切り替えるJavaScriptについて
下記のurlを参考にして、タグを切り替えるJavaScriptを使いレイアウトをしています。 http://archiva.jp/web/javascript/tab-menu.html やりたいことは各内容をIDセレクタでくくりたいのです。 <div id="page1"> <h2>page1</h2> <p>パンクズ</p> <div class="nav"> <ul id="tab"> <li><a href="#page1"><span>page1を選択中</span></a></li> <li><a href="#page2"><span>page2</span></a></li> <li><a href="#page3"><span>pave3</span></a></li> </ul> </div> <p>段落１</p> </div> <div id="page2"> <h2>page2</h2> <p>パンクズ</p> <div class="nav"> <ul id="tab2"> <li><a href="#page1"><span>page1</span></a></li> <li><a href="#page2"><span>page2を選択中</span></a></li> <li><a href="#page3"><span>pave3</span></a></li> </ul> </div> <p>段落１</p> </div> ...page3 このようにやりたいのですが、JavaScriptがIDセレクタの"tab"にしか対応していないため、他のページにいくとクリックが効かなくなってしまいます。 idセレクタをclassセレクタに設定し直してもidセレクタにしか対応していないため効きません。 tag2とtab3に対応させるためにはどのようにすればいいでしょうか。 よろしくお願いします。
- ベストアンサー
- JavaScript
お礼
詳細な回答、ありがとうございます。 難しいですが、すこしずつ勉強します。