ベストアンサー div内に文章をを書くときは、pタグで囲った方が良 2015/04/25 08:11 div内に文章をを書くときは、pタグで囲った方が良いのでしょうか? タダ文章を表示させるだけではなく、 「これは文章です」という意味を込めたいのなら、pタグで囲うべきですか? みんなの回答 (1) 専門家の回答 質問者が選んだベストアンサー ベストアンサー Taiyonoshizuku ベストアンサー率37% (183/489) 2015/04/25 17:54 回答No.1 Yes 質問者 お礼 2015/05/09 08:21 ありがとうございます。 広告を見て全文表示する ログインすると、全ての回答が全文表示されます。 通報する ありがとう 0 カテゴリ [技術者向] コンピュータープログラミング・開発HTML 関連するQ&A 画像はDIVタグとPタグの両方で囲むの? クラブのホームページを作っているんですが 分からない事がありますので質問させていただきます。 勉強している本で画像もPタグで囲むのが正しいと載ってましたので ------------------------------------------------------- <div><p><img src="○○" alt="なし"></p></div> ------------------------------------------------------- と記述していたんですが、 色々勉強していくとPタグではなく、 ブロックレベル要素で囲むのが正しいとの事ですので <div>も<p>もブロックレベル要素なので ------------------------------------------------------- <div><img src="○○" alt="なし"></div> ------------------------------------------------------- とか ------------------------------------------------------- <p><img src="○○" alt="なし"></p> ------------------------------------------------------- みたいに無理に<div>と<p>の2つではなく <div>だけ、または<p>だけで、囲むのも問題はないのでしょうか? ※スタイルシートでレイアウトしています。 ※画像はスペースを空ける為だけですので<div>~</div>に文章はありません。 同じくaltの指定もしていません。 ※画像でスペースを空けるは、あまり良くない事は分かっていての質問です。 別の質問ですけど、あるホームページでH2(見出しタグ?)で ------------------------------------------------------- <div><h2>タイトル</h2></div> <div><p>文章</p></div> ------------------------------------------------------- が正しいと載っていたんですが ------------------------------------------------------- <div> <h2>タイトル</h2> <p>文章</p> </div> ------------------------------------------------------- では間違っているんでしょうか? すいません、もう1つ質問です。 http://openlab.ring.gr.jp/k16/htmllint/htmllint.html でチェックしてみると98点でした。 私のパソコンや、友達のパソコンでは、ちゃんと表示されてるんですが 100点じゃないと、表示されないパソコンもあるんでしょうか? 学校が短大で男子がいないので HTMLやCSSが苦手な子ばかりです。 私と副部長で頑張ってほぼ完成しましたが、 はじめてホームページを作った初心者で 細かい事を教えてもらえる人がいなくて困ってます。 初心者の質問で申し訳ありませんが よろしくお願いします。 Web勉強中の初心者です。pタグとdivタグの区別 こんにちは。 web勉強を初めて3ヶ月の初心者です。 よく、コーディングしていて、imgタグを入れる際に、pタグを使うべきかdivタグを使うべきか迷ってしまいます。 最初は、わけもわからずdivで括ればいいのだと思っていましたが、そうでもないと気づき始めて、改めて本やネットで調べたらpタグは「段落」、divタグは「まとまり」となっていました。自分としては、ある程度のグループとして入れる場合はdivで囲んで、ある程度の量がある文章ではpタグという認識です。 ただ、そうすると画像を1枚入れたりとか、少しの文章と背景だけを入れたいときは、divではないだろうから、pタグなのかな?とか、それともタグを入れずに、前後のdiv間に、文章やimgだけで入れるべきなのかな?と考えていくと正直混乱してしまいます。 もしくは、そういう場合は前後のdivも含めた自分のグループの分け方自体が、おかしいのかもしれません。 わかりにくい文章ですいません。 いいアドバイスありましたら、よろしくお願いします。 <P>タグと<div>タグについて <P>タグと<div>タグには“前後に空行が入るかどうか”という違いがあるそうですが、下記のようなデータを作り、自分のホームページに記入したところ、前後に全く空行が入りませんでした。 しかし、自分のホームページ以外で、このデータを試してみたところ、<p>タグにはきちんと空行が入るようです。 記入する場所によって、空行が入ったり入らなかったりするのは、なぜなのでしょうか? ※ブラウザはIE8を使用しています。 <P align="right" style="width:740px;margin:auto;">●●●</p> <P align="right" style="width:740px;margin:auto;">●●●</p> <P align="right" style="width:740px;margin:auto;">●●●</p> <div align="right" style="width:740px;margin:auto;">▲▲▲</div> <div align="right" style="width:740px;margin:auto;">▲▲▲</div> <div align="right" style="width:740px;margin:auto;">▲▲▲</div> ネットワークエンジニアとは?技術職の未来を考える OKWAVE コラム 、<div>と<P>では、どちらを使ったほうが良い ページの上の部分に内容のタイトルを表示させています。 そのタイトルにタグをつけて装飾する場合 cssで設定するのですが、<div>と<P>では、どちらを使ったほうが良いのでしょうか? 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を併用すれば思った表示にはできると思うのですが、今回はこうなってしまう理由が知りたく質問させていただきました。 また私の記述方法に誤りがあればご指導いただけると助かります。 宜しくお願い申し上げます。 本文を記載する場合はpタグを使ったほうが良い? <div>本文</div> とするのと <div><p>本文</p></div> とするのではどちらがいいのでしょうか? 本文を記載する場合はpタグを使ったほうが良いですか? divタグで本文を表示する位置をmarginなどで設定しています。 pとdivのどちらが良いでしょうか? pタグとspanタグとdivタグの使い分けがよくわからないので http://techmemo.biz/html/p%E8%A6%81%E7%B4%A0%E3%80%81div%E8%A6%81%E7%B4%A0%E3%80%81span %E8%A6%81%E7%B4%A0%E3%81%AE%E3%81%9D%E3%82%8C%E3%81%9E%E3%82%8C%E3%81%AE%E9%81%95%E3%81%84/ を読んだのですが、それでもよくわかりません。 私がやりたい事はindexページにタイトルを表示したいのですが 文字の装飾はしたいです。 でも文字全部に色を付けてサイズを調整したいだけなので spanタグで文字の中の一部の装飾ではないです。 この場合 pとdivのどちらが良いでしょうか? ページの上部に ~サイトの名前~ みたいにしたいです。 <div>テキスト</div> HTMLを記述する際に文書構造を明確に…と考えています。 見出しにはHタグ、本文にはPタグ、リストにはliなどなど。 ある書籍でbody直下にテキストを配置するのはいけない、と書いてありました。テキストに意味付けがなされていないから、というようなことが理由として書いてありました。 そこで思ったのですが、divはもともと意味をなさないブロック要素ですが、この直下にテキストを配置すると、このテキストは文書構造上意味を持たないものになって、文法上間違っているのでしょうか? 今のところ、 <div><p>テキスト</p></div> のように、pで意味付けをするのが正しいのかな、と考えていますが、W3Cのホームページではdiv直下にテキストを配置しているものがありました。 皆さんのご意見を伺いたいです。 div直下のテキストは正しいのか、間違っているのか、どうでもいいのか? dlタグの中にdivは使える? dlタグの中で、dtタグとddタグを一つのdivで囲ってもよいのでしょうか?? 以下のようなかたちなのですが・・・。 使い方として間違っているのでしょうか?? ↓ ------------------------------------------------ <dl> <div class="aaa"> <dt>タイトル01</dt> <dd> <h4>説明文説明文説明文説明文説明文説明文</h4> <p><img ・・・・・></p> </dd> </div> <div class="aaa"> <dt>タイトル02</dt> <dd> <h4>説明文説明文説明文説明文説明文説明文</h4> <p><img ・・・・・></p> </dd> </div> <div class="aaa"> <dt>タイトル03</dt> <dd> <h4>説明文説明文説明文説明文説明文説明文</h4> <p><img ・・・・・></p> </dd> </div> </dl> ------------------------------------------------ dlタグの中には直接dtタグとddタグしか入れることができないということのようですが、 これはdivは入れられないということになるのでしょうか?? (dtはインライン要素のみ、ddはブロック要素もインライン要素も使えるということなので、 ddの中ではdivが使えると思うのですが・・・。) また、もしdivで囲えないとしたら、 今回の場合は、それぞれを一つのdlで囲ってしまうべきなのでしょうか?? ご存知の方いらっしゃいましたら、よろしくご指導ください。お願いします。 <DIV>タグで書いた文字が、 <DIV>タグで書いた文字が、 IEで位置を合わせるとFIREFOXではズレてしまいます。 どうしてなんでしょう? <DIV style="top : 79px;left : 55px; position : absolute; z-index : 23; width : 530px; height : 13px; " id="moji"> <P><FONT size="2">IE8とFIREFOXとでズレる</FONT></P> どうもこんな感じのプログラムで、だいたい20ピクセルぐらい下がって表示されてしまうようです。 前に同じ質問をしたのですが、うまく解決できなかったもので急いでます… divタグ(span)についての質問です。 divタグ(span)についての質問です。 ふと気になったのですが、divタグ(span)の名前は必ずつけないといけないのでしょうか?(【id="任意の名前"】の部分です) ただのブロック要素としてのみ使うときには、特にスタイルシートには記述しないので、名無しでも大丈夫なのかな~?と思いまして、、、 ご存知の方いらっしゃいましたらアドバイスをいただけると幸いですm(__)m 宜しくお願いいたします。 divタグについて 初心者です。 xhtml+cssでdiv idというタグを何箇所にも利用してますが、div classはどういうときに使うんですかね? AIは使う人の年齢や市場にも影響する?人工知能の可能性 OKWAVE コラム 段落タグ<p>について教えてください。 昔、どこかのサイトで<p>タグは必要不可欠のものだ、との記述を見たことがあります。例えば <h1>タイトル</h1> <h2>サブタイトル</h2> <p>説明文</p> のように。必ず<p>タグで文章をくくらなければいけない、 というのが、『本来』の規則なのでしょうか。(←質問1) もしそうだとして、テーブルやリストなども<p>でくくるのですか? (↑質問2) また、<div>を使い1つの段落をブロックとしてまとめる(?)ときも<p>を使うのでしょうか、それは<div>の外側と内側、どちらに書くべきですか?(←質問3) 上記の質問はインライン要素、ブロック要素というようなものと関係があるのですか?(←質問4) 最後に、複数の改行を行うとき、<br>の連続は禁止されていますが、スペースだけの段落で改行を演じるのはどうなのでしょうか。(質問5) 長くなりましたが、簡単にでいいのでよろしくお願いします。 CSSでのdivタグに付いての質問です。 現在HTMLを学習し始めたばかりで困惑しております。 HTML内の<body>タグ内に<div>タグを作りidを"main"としました。 具体的には<div id="main">Main</div>と記述しました。 そこからCSSで#main {color: red;} と記述しましたが、文字色の変更が全く反映されない状態です。 他の<p>タグや<h1>タグ、また<body>タグは全て奇麗に反映されるのに<div>だけが全然ダメな状態です。 一体何が原因なのか教えて下さい。 初心者すぎる質問だと思いますが、どうぞよろしくお願い致します。 文章を書いているのですが…。HTMLタグについてです。 こんにちは。 私は、自分のHPで文章を書いています。 <pre>タグを使って書いていると、横にスクロールしないと読めないくらい長くなってしまって、自分で見てて見づらいな~と思っています。 色々、文章の書いてあるHPを回ってみると、ある一定の文字数で改行され、真ん中に文字のある文章を見つけて、自分もこんな風に読みやすくしたい、と思いました。ですが、タグのについて書いてあるHPを見てもどのタグがそれに該当しているのかがイマイチ理解できませんでした。(恐らくdivタグではないかと思っているのですが…) どのタグを使ってどのように指定したらよいのでしょうか? タグについて分かる方、どうか回答をお願いします。 <section>タグと<div>タグ <section>タグと<div>タグはどう使い分ければいいのでしょうか? どちらも、グループ分け・カテゴリー分けする際に使っています。 大グループは、<section>で分けて、その<section>で分けたグループを さらに細分化してグループ化するときに<div>タグを使えばいいのでしょうか? <div>と<p> の違いがいまいちよく分かりません。分からないので、<div>*****<p>***</p>*****</div>のような記述をしているのですが、これは正しい記述法ですか? どこをテーブルで作るべきか、divタグで作るべきかの境目というか、考え どこをテーブルで作るべきか、divタグで作るべきかの境目というか、考え方が 微妙で困っています。 サイトレイアウト大まかな段組は<div>でできるだけ行うように、みたいにCSSデザインの勉強をしていると書いてあり、その意味は分かりますが、<div>タグで概観をレイアウトしても、結局は、divで定義したコンテンツBOXの中身だったりメニューの中身だったりは テーブルで配置したほうが更新作業的にやりやすいし、テーブルほうがよいのでは? みたいに、なってしまいます。 左に画像、右にコメント(文字列)などの関係のものが、以下に複数続いたりする場合、 どう考えてもテーブルのほうがよくない?って思うんですよね。 その場合でも無理やりdivタグでテーブル構造を作るもんなんですかね? divタグだとコード量が少なくなるからSEO対策的に良いっていうのは理解できますが、 divタグはここまで作る、テーブルタグの使い分けが微妙です。 このときはテーブルにしないといけない。とかないんでしょうから ある意味センスなんでしょうが。。。。 製作の効率と、コンテンツの管理の仕方を考えると divタグとテーブルの使い方の境目が分からなくなってしまいます。 そのへんの考え方ノウハウを教えてください。 ■divにid指定して子供タグに適応(ソース付) みなさん、よろしくお願いします。 上の段と下の段を表示上同じ結果にしたいと思います。 現在、上の段のようにdivタグ以下の全てのタグに、GrayMojiを 指定しています。 本番のソースでは、これが大量にあるので、簡潔に書きたいと思っています。 そこで、下の段のように、1つだけidを指定しただけで、divタグに含まれている 全タグにGrayMojiを適応させたいと思っています。 でも、このソースでは、同じ結果が得られません。 どのようにすれば、良いかアドバイスをいただけないでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <style type="text/css"> <!-- a:link{ color: #0033EE;} #GrayMoji {color: #666666;} --> </style> </head> <body> <div> <a id="GrayMoji" href="main/about.html">div-AタグClass</a> <p id="GrayMoji">div-pタグClass</p> </div> ------------------------------------ <div id="GrayMoji"> <a href="main/about.html">divタグClass-A</a> <p>divタグClass-p</p> </div> </body> </html> 複数のタグをDIVタグで囲みたい <TD>タグの中に<IFRAME>タグと<INPUT>タグがあり、それを<DIV>タグで囲みたいのです。 <TD> <TD> <IFRAME id="xxx" ... ==> <DIV> <INPUT id="yyy" ... <IFRAME id="xxx" ... </TD> <INPUT id="yyy" ... </DIV> </TD> jQueryのwrapall関数かと思うのですが、サンプル等では同じ種類のタグを囲むものしか ありませんでした。 jQueryは経験がないので、四苦八苦しています。 どなたかお知恵をお貸しください。 よろしくお願いします。 注目のQ&A 「You」や「I」が入った曲といえば? Part2 結婚について考えていない大学生の彼氏について 関東の方に聞きたいです 大阪万博について 駅の清涼飲料水自販機 不倫の慰謝料の請求について 新型コロナウイルスがもたらした功績について教えて 旧姓を使う理由。 回復メディアの保存方法 好きな人を諦める方法 小諸市(長野県)在住でスキーやスノボをする方の用具 カテゴリ [技術者向] コンピューター プログラミング・開発 Microsoft ASPC・C++・C#CGIJavaJavaScriptPerlPHPVisual BasicHTMLXMLCSSFlashAJAXRubySwiftPythonパフォーマンス・チューニングオープンソース開発SEOスマートフォンアプリ開発その他(プログラミング・開発) カテゴリ一覧を見る OKWAVE コラム 突然のトラブル?プリンター・メール・LINE編 携帯料金を賢く見直す!格安SIMと端末選びのポイントは? 友達って必要?友情って何だろう 大震災時の現実とは?私たちができる備え 「結婚相談所は恥ずかしい」は時代遅れ!負け組の誤解と出会いの掴み方 あなたにピッタリな商品が見つかる! OKWAVE セレクト コスメ化粧品 化粧水・クレンジングなど 健康食品・サプリ コンブチャなど バス用品 入浴剤・アミノ酸シャンプーなど スマホアプリ マッチングアプリなど ヘアケア 白髪染めヘアカラーなど インターネット回線 プロバイダ、光回線など
お礼
ありがとうございます。