- ベストアンサー
aタグの中にdivタグを入れる場合について。
think49の回答
#2,5,7 です。 --- (例題) A要素がB要素を内包できるか否かを確認したい この場合、A要素の Content model を見る必要があります。 (ケース1) 1. A要素の Content model は Flow content 2. B要素の Categories は Flow content なので、A要素はB要素を子要素に出来る 実際はありませんが、仮に Flow content に Content model が定義されているとすればこうなります。 (ケース2) 1. Flow content の Content model は Flow content 2. A要素の Categories は Flow content なので Flow content を子要素に出来る 3. B要素の Categories は Flow content なので、A要素はB要素を子要素に出来る --- (ケース2) がありえない理由がわかるでしょうか。 同じ Flow content でもdiv要素は「Content model: Flow content」ですが、p要素は「Content model: Phrasing content」です。 ある要素の Categories が Flow content だからといって一律に Flow content を子要素に出来るというロジックにはなりません。 http://www.whatwg.org/specs/web-apps/current-work/multipage/grouping-content.html#the-div-element http://www.whatwg.org/specs/web-apps/current-work/multipage/grouping-content.html#the-p-element
関連するQ&A
- floatさせたdivタグを折り返させたくない
Javascriptで開いた子ウィンドウ内のページについて レイアウトで困っております。 以下のようなブロック要素の配置について <div> <div style="float; left"> コンテンツA </div> <div style="float; left"> <div> コンテンツB </div> <div> コンテンツC </div> </div> <div style="clear: both"> </div> 以上のような配置になっており、 コンテンツ３の中身をJavascriptで書き換えています。 その際、コンテンツCの横幅が変動し右に大きく広がる場合があります。 それにより、ウィンドウサイズによってはコンテンツBCがコンテンツAに回りこんでしまいます。 何故こうなるかは理解出来るのですが、対策が思い浮かびません。 ●思いついたが避けたい対応策 ・親のdivタグに想定出来る最大値のwidthを設定する ・tableタグによるレイアウト 良い対応策はございませんでしょうか？ よろしくお願いします。
- 締切済み
- HTML
- ■divにid指定して子供タグに適応(ソース付)
みなさん、よろしくお願いします。 上の段と下の段を表示上同じ結果にしたいと思います。 現在、上の段のようにdivタグ以下の全てのタグに、GrayMojiを 指定しています。 本番のソースでは、これが大量にあるので、簡潔に書きたいと思っています。 そこで、下の段のように、１つだけ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>
- ベストアンサー
- HTML
- 開始タグと終了タグについて
開始タグと終了タグについて ものすごく初歩的な質問で失礼します。 <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
- DIVタグでの擬似インラインフレーム
<DIV>タグで擬似インラインフレームを実現させようと思っています。 <DIV>タグ内に<table>タグがあって、<td>タグ内に<A>タグテキストリンクがある場合に、そのリンクを右クリックしてプロパティを表示させると、 <DIV>タグの位置がずれてしまいます。 ・動作テスト OS：WindowsXP SP１ ブラウザ：IE6 ・テキストリンク<a>タグを右クリックしてプロパティを表示させたときのみ発生する。 ・NN7.1では発生しません。 原因がまったくわかりません。 簡単な例↓ <DIV style="width:640px;height:350px;overflow:scroll;"> <table width=620px><tr><td><A href=http://www.yahoo.co.jp>YAHOO</A></td></tr></table> </DIV> 以上のような感じです。 しかし、実際に操作していただくと、何が問題なのかがわかると思いますので、以下のページを参照してください。 http://members3.jcom.home.ne.jp/takokko/divframetest.html 大変困っております。なにとぞ、宜しくお願いいたします。
- ベストアンサー
- HTML
- CSS適用ページで余分なDIVタグが要求される
CSS初心者です、質問させてください。 XHTMLに外部CSSを添付させています。 headerは３ブロック、 contentsは３ブロックに分けてから各ブロックに複数ブロックをいれています。それら複数ブロックはそれぞれ幅と高さを指定しています。 contentsとfooterには「clear: both;」をいれています。 ソースは以下の通りです。 <?xml version="1.0" encoding="Shift_JIS"?> <!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> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <title>無題ドキュメント</title> <link href="affiliate.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="header"> <div id="a_Left"> <div id="a1">A1</div> <div id="a2">A2</div> </div> <div id="a_right"> <div id="a3">A3</div> </div> </div> <div id="contents"> <div id="conLeft"> <div id="b1">B1</div> <div id="b2">B2</div> <div id="b3">B3</div> </div> <div id="conCenter"> <div id="c1">C1</div> <div id="c2">C2</div> <div id="c3">C3</div> </div> <div id="conRight"> <div id="d1">D1</div> <div id="d2">D2</div> <div id="d3">D3</div> <div id="d4">D4<div> </div> </div> </div> </div> <div id="footer">E1</div> </body> </html> 明らかにid="footer"の上にある</div></div>は不要なのですが、入れないと表示がおかしくなります。 なぜかさっぱりわかりません。 どうすればいいのでしょうか？ よろしくお願いします。
- ベストアンサー
- CSS
- css(div)の中にtableタグを使うとなぜかcellpaddingがきかない
cssのdivの中にtableタグを入れ子にして作成していますが、中側tableのcellpaddingを5に指定しているにもかかわらず余白があきません。 過去ログにCSSの設計思想からすると、DIVの中にTABLE要素を組み込むことは論理矛盾であると書かれていましたが、複雑な表になってくると知識がないため、テーブルを使っているのが現状です。 なぜ余白があかないのでしょうか？また対応する方法はあれば教えていただきたいです。よろしくお願いします。 <div id="fee_table"> <table width="460" border="0" cellspacing="0" cellpadding="0"> <tr> <td bgcolor="#C4D6A7"><table width="460" border="0" cellspacing="1" cellpadding="5"> <tr> <td bgcolor="#FFFFCC">テキスト</td> <td valign="top" bgcolor="#FFFFFF">テキスト</td> </tr> <tr> <td bgcolor="#FFFFCC">テキスト</td> <td valign="top" bgcolor="#FFFFFF">テキスト</td> </tr> <tr> <td bgcolor="#FFFFCC">テキスト</td> <td valign="top" bgcolor="#FFFFFF">テキスト</td> </tr> </table></td> </tr> </table> </div> ■---css---------------------------------------■ #fee_table { font-size: 95%; margin : 10px 0 10px 15px; }
- 締切済み
- HTML
- XHTML1.1で空要素タグを書くと、W3CのValidatorでエラ
XHTML1.1で空要素タグを書くと、W3CのValidatorでエラーが出てしまいます。 下記のXHTMLをW3CのValidatorでチェックをすると、body内の<br />の箇所でエラー出てしまいます。 =========================================================== <!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title></title> </head> <body> <br /> </body> </html> =========================================================== エラーの内容は下記の通りです。 document type does not allow element "br" here; missing one of "ins", "del", "h1", "h2", "h3", "h4", "h5", "h6", "p", "div", "pre", "address", "fieldset" start-tag <br /> The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element. One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>"). =========================================================== <img>などの<br />以外の空要素タグを入れても同様のエラーが出ます。 ただし、<div><br /></div>とするとエラーが出ません。 XHTML1.1の仕様では、空要素タグはブロック要素タグなどで囲わないといけないのでしょうか？ もしくは、記述になにか間違いがあるのでしょうか？ ご教示をお願いいたします。
- ベストアンサー
- HTML
- divでくくった中の要素にa link
以下のdivでくくった中の要素にa link等の カラーの指定をしたいのですが、どのように記述したらよいでしょうか。 div.main { width: 560px; padding-top: 15px; padding-left: 20px; line-height: 130%; } --------------- div指定していないところでは a:link, a:visited { color: #000000; font-size: 12px; line-height: 120%; text-decoration: none; } a:hover { color: #0066CC; text-decoration: underline; } a.navia:link, a:visited { font-size: 8pt; color: #666666; text-decoration:none;} a.navia:hover { color: #FF6633 ; text-decoration:underline } の2つを記述しています。
- ベストアンサー
- HTML
- ボタンにinputを使う場合と使わない場合がある？
ボタンにinputを使う場合と使わない場合がありますが、見た目がボタンでも 下記に該当しないものはaを使えばいいでしょうか。 inputタグ（input要素）は送信ボタンやリセットボタン、テキストの入力欄、チェックボックスなどを表します。 下記サイトはpの中にaタグを使って表現していますが、セマンティックだと思いますか？ http://jfarm-tomato.com/ pはコンテンツの一部を示すタグですよね。 このサイトの詳細はこちらボタンなどもコンテンツの一部と考えらるのでしょうか？
- 締切済み
- HTML
- HTMLタグについて
<!-- #EndEditable --> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <link rel="stylesheet" href="古いデーター/text.css" type="text/css"> </HEAD> <BODY bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="5" marginwidth="0" marginheight="5"> <table width="760" border="0" cellspacing="0" cellpadding="0" align="center"> <tr> <td><div align="center"><img src="toppu2.gif" width="700" height="92"></div></td> </tr> </table> <div align="center"> <table width="760" border="0" cellspacing="0" cellpadding="0"> <tr> <td><div align="center"><img src="botan4.gif" width="700" height="57" border="0" usemap="#Map6"></div></td> </tr> <tr> <td><div align="left"><!-- InstanceBeginEditable name="contents" --> ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ 上記のタグで 【<link rel="stylesheet" href="古いデーター/text.css" type="text/css"> 】が文字化けしてるから可笑しいと思うのですが、これを テンプレート上で下記のように修正してもエラーが出て 上手くいきません。 <link rel="stylesheet" href="../../text.css" type="text/css"> この他におかしい部分が多分あると思うのですが、 そこをお教えください。 宜しくお願い致します。
- ベストアンサー
- その他([技術者向] コンピューター)
お礼
たぶんわかったと思います。 html4のブロック要素、インライン要素の関係性、概念は捨て去るべきだと思いました。 今までは「html5って、所詮はhtml4からタグが増えたり減ったりしただけでしょ？」 という考えでした。 html4の延長にhtml5があるという理解は、少なくともコンテントモデルに関しては違うという理解で、概ね合っていると思いました。 html5が新しい概念を導入してきたことは残念でもあり、楽しみでもあると思いました。 今期強くお付き合いいただいたthink49さん、Tacosanさんに感謝いたします。 ありがとうございます。 お二方がいてここまでの回答を得られたものですので、 ベストアンサーはお二方に贈ります。 （システム上一つしか贈れないので、現場主義的だった方へ、贈っておきます。）