- ベストアンサー
<br /><hr />どっちを使ったらいいの？
xenotacticの回答
W3C的に言うと、現時点ではどちらも正しくないです。 clear="both"は「回り込みを解除する」という「視覚的な装飾」です。現在(xHTML1.0)のW3Cの考えでは、「視覚的な装飾」はすべてCSS（カスケーティングスタイルシート）で行い、HTMLでは「論理的な構造」を作成するためだけに使うということになっています。 clear="both"に似た効果をもつCSSは「clear:both;」です。style属性を使えばHTML内に直接CSSを書き込むことができます。 <br style="clear:both;" /> <hr style="clear:both;" /> この2つでどちらがいいかについてですが、これは場合によりけりです。W3Cは先ほど説明したように「HTMLは論理的な構造を作成するためだけ」に使うべきだと考えているので、「clear:both;を指定するためにbr要素やhr要素を入れる」というのはW3Cの考えに反しています。clear:both;を指定したいところにあった要素に対してclear:both;を指定し、clear:both;を指定するために新たに要素を付け加えるということはしない、というのが正しいやり方です。
noname#130082
noname#83877
noname#100277
関連するQ&A
- <br> が <br /> に置き換えられる
DOCTYPEはHTML4.01 Transitionalでやっているんですが、 brタグをつかうとXML用に<br />と変換されてしまいます。 何か記述に問題があったのでしょうか。。 HTMLでこの書き方をしても支障はないと聞きました。 W3Cでチェックを行いましたが、やはりひっかかりませんでした。 しかし、Another HTML-lint gatewayでチェックしてみると、W3Cとは逆に重要な問題としてひっかかってしまいました。。 フリーページを使って作成しています。
- ベストアンサー
- HTML
- <br style="clear:both;">っておかしくないですか？
私は初心者でよく分からないのですがお尋ねします。 ホームページを作っていて、firefoxなどでメインのboxに高さが反映されません。(メインboxの中は3カラムです)で、とあるWEBサイトで<br style="clear:both;">を最後に記述すればOKと書いてあったので、早速やって見ました。 するとアラ不思議、本当に反映され、高さも表示されたのですが、この<br style="clear:both;">という表記って何かおかしくないですか？<br>にstyleですか・・・。 これはWC3的にはどうなのでしょうか？？？ 推奨されていますか？ もっといい方法があれば教えていただきたいのですが・・・。
- ベストアンサー
- HTML
- CSSテキストの回りこみ解除について
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> CSSでサイトをつくっています。 写真の右にテキストを回り込ませるのにfoat:leftをimgに指定しているのですが、 <div style="clear: both;"> <br style="clear: both;"> で解除すると、Firefoxで下に200pxくらいの余白ができてしまいます。（IEは問題ありません） そこでbothをallに変えると、Firefoxでもきちんと表示されるのですが、allはHTML 4.01は非推奨とのこと。 テキストの回りこみはどのようにすればうまく行くのでしょうか？
- ベストアンサー
- HTML
- cssで2列、複数行のテーブルを作りたい。
これって1行をdivで囲ったり、<br style="clear:both" />で区切ったりしなきゃいけないんでしょうか？ 昔いろいろ困ったことがあったので、ふと思い出して質問させていただきました。 なんとかなるっちゃ、なるんですが・・・なんかスマートなやり方はないものかとｗ
- 締切済み
- HTML
- MHP2G で HR1 で G装備 可能か？
モンスターハンターポータブルセカンドＧ ＨＲ１でどこまでいけるか楽しんでいます アカムをハメ殺してアカム装備までいきました！ そこでネコート最後のクエスト「モンスターハンター」 で出てくる素材が俗に言うＧ素材だということで ＨＲ１でも俗に言うＧ装備が作れるのでしょうか？ mhp2gwikiていうＨＰのクエストのところに書いてある手に入る素材を見るとあとひとつ足りない!! ていう感じで微妙に作れません（よく見てないかも？） ですが、剥ぎ取り分なのか部位破壊報酬なのか乗っていないものもちらほら出てきました（残念ながら上位素材でしたが） 確立が低いだけで足りない分のＧ素材も出てくるのでしょうか？ 武器、防具どっちでもいいです、なにか作れればなぁと 装飾品（珠）はちょっといやだなｗ ちなみに「モンスターハンター」をクリアしたのはＨＲ９のキャラでやりました ライトボウガン使いなのですが、ＨＲ１キャラだと貫通弾の数が足りなくて今一歩でクリアできずｗ
- ベストアンサー
- その他(ゲーム)
- <td></td> と、<td><BR></td>
<td></td> と、<td><BR></td> ホームページビルダーで作ったホムペを、KompoZerというHTMLエディタで開くと、 テーブルのなにも入っていないセルに<BR>タグが勝手に挿入されてしまいます。 <td></td> と、<td><br></td> は、 ブラウザ上ではどちらでもちゃんと表示されるのですが、 HTML文法的にはどちらが正しいのでしょうか？ また、どちらも正しい場合、<br>がある・ないで、違いがあるのでしょうか？ ※ホームページビルダー、KompoZerの善し悪しは無視してください。
- ベストアンサー
- HTML
- ＰＨＰについて
htmlでページを作って見ましたが同じ項目を何ページも記入しなければいけませんので1つのファイルを常に貼り付けるよう出来るにはどういう風にすればよろしいですか？ 例えば↓ <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY> <HR> <P>□項目1<BR> □項目2<BR> □項目3<BR> □項目4<BR> □項目5<BR> □項目6<BR> □項目7<BR> □項目8</P> <HR> <P>□項目A<BR> □項目B<BR> □項目C<BR> □項目D<BR> □項目E<BR> □項目F<BR> □項目G<BR> □項目H</P> <HR> <P>□項目1<BR> □項目2<BR> □項目3<BR> □項目4<BR> □項目5<BR> □項目6<BR> □項目7<BR> □項目8</P> <HR> </BODY> こういう風に自動でなるようにしたいのですが、 どなたか宜しくお願いします。 </HTML>
- 締切済み
- PHP
- <br>を一瞬で付ける方法
ここでは初めまして。 ホームページを作り初めてから、５年ぐらいやっています。 私のサイトは、イラストと小説を載せている、完全趣味のページです。 小説はいつもメモ帳かWordで打ち込み、終わった後で改行の<br>を一行ずつコピー＆ペイストをしていました。 しかしここの所、小説は書けるものの<br>を打ち込む時間まで余裕がありません。 早く更新をするため、に何か・・・<br>を一瞬で付けれるようなプログラムはありませんか？ ホームページビルダーとかは使ったことがなく、できればお金をかけたくありません。 無料で、「ここなら簡単に改行のタグを一瞬で付けれる」というようなサイトがあれば、教えていただけないでしょうか。 今までHTMLのサイトだけ覗いて、一人ずっとタグを打ち続けてたため、プログラム名などがよくわかりません・・・。 できるだけ早く、回答がほしいです。 お願いします。
- ベストアンサー
- ホームページ作成ソフト
- ieとfirefoxでdiv枠に２pxのズレ
宜しくお願い致します。 現在下記のHTMLを作成致しましたが、CSSにてfirefoxとchomeに合わせると ieではdiv枠が2px程左右にズレが生じてしまいます。ieに合わせると逆の現象が生じます。 何が原因なのか判りません。宜しくご教示下さい。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <style type="text/css"> .clear {clear:both; } .clear hr {display:none;height:0px;font-size:0pt; } #wrap {width:810px; text-align:center; margin:0px auto;} #header{font-size:70%;color:green;margin-top:5px;text-align:center;} #menu {width:200px;height:auto; float:left;margin:0;position: relative;} #goods {width:600px;height:auto; float:right;margin:0;position: relative;} #top-title { width:200px;height:70px; float:left; margin-bottom: 10px;background-color:#ffffee; border:solid 1px #336600;position: relative;} #top-menu { width:600px;height:70px; float:right; margin-bottom: 10px;background-color:#ffffee; border:solid 1px #336600;position: relative;} /* position: relative削除したり widthの値を%にしたり色々試してみましたが??? */ .col_01_l{width:295px;height:310px;position: relative; float:left; margin-bottom: 5px;background-color:#ffffee;border:solid 1px #336600;} .col_01_r{width:295px;height:310px;position: relative; float:right;margin-bottom: 5px;background-color:#ffffee;border:solid 1px #336600;} .col_05 {width:200px;height:auto; float:left; margin-bottom: 8px;background-color:#ffffee; border:solid 1px #336600;} .col_06a {width:600px;height:auto; float:right; margin-bottom: 10px;background-color:#ffffee; border:solid 1px #000000;position: relative;} </style> </head> <body> <div id="wrap"> <div id="header"> </div><!-- /header --> <div id="goods"> <div id="top-menu"> </div><!-- /top-menu --> <br style="clear:both;"> <div class="col_06a"> <br><br> </div> <br style="clear:both;"> <div class="col_01_l"> <p>ブラウザieではずれませんが、 chrome、firefoxで、この枠が 右に２pxにずれる。 どのように直せば良いか具体的にご教示下さい。</p> </div> <div class="col_01_r"> <br> </div> <br style="clear:both;"> </div><!-- /goods --> <!-- ################################################################################## --> <div id="menu"> <div id="top-title"> <br> </div> <br style="clear:both;"> <div class="col_05"> <br><br> <br><br><br><br> <br><br><br><br> <br><br><br><br> <br><br> </div><!-- /col_05 --> <br style="clear:both;"> </div><!-- /menu --> <br style="clear:both;"> <!-- ################################################################################## --> </div><!-- /wrap --> </body> </html>
- ベストアンサー
- CSS
お礼
お返事遅くなりまして申し訳ないです。 質問をしてしばらくたちますが、なるべく<br /><hr />にclear:both;を使わないようにしています。 最近まで<br />でclear:both;を使ってたCSSは構成をすべてfloatでどうにかしようと思っていたので、<br /><hr />に固執しすぎてたのかな…と思っています。 今見るとスタイルシートもかなり汚いです…（汗） 回答のおかげで、いろんなところがスッキリしました。 ありがとうございます！