- ベストアンサー
HTML言語でHPを編集する方法とは？
- HTML言語を使用してHPを編集する方法について教えてください。
- HP編集の際に右の余白に提灯を動かしたいがうまくいかないと困っています。
- HTML言語でHP編集するためのタグや画像配置について詳しく教えてください。
- JZ302
- お礼率92% (1106/1202)
- レンタルサーバ・ASP
- 回答数4
- ありがとう数5
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
長くなりますがご容赦ください。お書きになっていたタグに行をつけて見やすくしてみました。（空白タグは除いてあります） 01 <CENTER> 02 <TABLE border="0" cellpadding="0" cellspacing="0"> 03 <TR> 04 <TD width="700" height="10" background="red.gif"></TD> 05 </TR> 06 </TABLE> 07 </CENTER> 08 <CENTER> 09 <TABLE border="0" cellpadding="0" cellspacing="0"> 10 <TR> 11 <TD width="10" height="150" background="red90.gif"></TD> 12 <right><img src="tyoutin.gif" width:76px; height:96px; border="0" alt="maru"></right> 13 <TD align="left">日付</A><BR><BR> 14 日付<BR><BR> 15 日付</P> 16 <TD width="10" height="150" background="red90.gif"></TD> 17 </TR> 18 <CENTER> 19 <TABLE border="0" cellpadding="0" cellspacing="0"> 20 <TR> 21 <TD width="700" height="10" background="red.gif"></TD> 22 </TR> 23 </TABLE> 24 </CENTER> 1）これは2つのテーブルで構成されているのでしょうか？3つのテーブルで構成されているのでしょうか？ 2つのテーブルなら17行目と18行目は不要で、23行目と24行目の間に</tr>と</table>が必要です。 3つのテーブルなら18行目に</table>が入り、且つ、7行目、8行目、18行目の<center>や</center>は不要です。 2）回答No.1の方のご指摘通り、12行目は11行目の<td>に入れないと成立しません。 書き方の例としては、 <TD width="10" height="150" background="red90.gif"> <div align="right"><img src="tyoutin.gif" width="76" height="96" border="0" alt="maru"></div> </TD> となるかと思います。 3）13行目から15行目ですが、意味のない</a>や</p>が入っています。正しくは、 <TD align="left">日付<BR><BR> 日付<BR><BR> 日付</TD> ではないかと思います。 文字数の制限がありますので、テーブル3つの場合を想定して書いたものを画像として添付しますので、ご参考までにご覧下さい。
その他の回答 (3)
- ORUKA1951
- ベストアンサー率45% (5062/11036)
CSSにミスがあったので修正して・・ 下記をメモ帳にコピーペーストしてsample.htmlとして保存し表示させてみる。 <html><head> <style> div.Menue{ width: 400px; border: solid red 5px; clear: both; margin-left: auto; margin-right: auto; padding: 6px;} div.Menue p.Logo{ float:right; background-color:red; width:71px; margin:5px;} div.Menue ol{ display:block; margin:0px; padding:0px;} div.Menue ol li{ list-style: none; margin:0px; padding:0px;} </style> </head><body> <div><h1>見本</h1> <div class="menue"> <p class="Logo"> <img src="http://cmm001.goo.ne.jp/img/logo/goo.gif" width="71" height="37" alt="gooLogo"> </p> <!-- width属性の場合は値は=""とかく。--> <ol class=""> <li>日付:○○○○○○○○○○○○</li> <li>日付:○○○○○○</li> <li>日付:○○○</li> </ol> </div> </body></html>
お礼
ありがとうございます。わかりました。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
HTMLの記述に関する質問ですね。 まず、参考にされている資料は破いて捨ててください。 【理由】 <CENTER>は非推奨です。( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/graphics.html#edef-CENTER ) <BR>が連続しています。 は、改行しない空白文字です。スペースを開けるために使用すべきではありません。とこにその後に<BR>が来ているのは意味的におかしい。 <right>このような要素は、HTML4では廃止されています。 ★とても大事★ HTMLはデザインするための言語ではなく、文書中の要素を識別させるためのマークアップ言語である。 たとえば、<strong>この部分は重要</strong> <h2>ここは見出し(レベルは２)<h2> <p>ここからひとつの段落</p> <ul><!-- ここからリスト(順位がある箇条書き) --> <li>箇条書きの一行</li> </ul> というふうに、 あなたの場合は多分 ・・・・以下のソースはわかりやすいように全角スペースでインデントさせています。テストするときは全角スペースをタブに変換してください。・・・・ <div class="menue"> <p class="Logo"> <img src="tyoutin.gif" width=76" height="96" alt="maru"> </p> <!-- width属性の場合は値は=""とかく。--> <ol class=""> <li>日付</li> <li>日付</li> <li>日付</li> </ol> </div> とでもしておいて、・・これで機械にも文書の構造がわかる・・・ CSSにて div.Menue{ width: 700px; border: solid red 5px; clear: both; margin-left: auto; margin-right: auot; } div.Menue p.Logo{ width: 76px; float:right; background-color:red; } div.Menue ol{ display:block; margin:0px; padding 0opx; } div.Menue ol li{ list-style: none; margin:0px; padding 0opx; } 位ですむはずです。 ★テキストエディタで、HTMLを作成するのは、オーサリングツールを使うと、文章の内容を読んで判断できない機械(コンピュータ)では、適切なマークアップができなかったり、無用な、あるいは不適切なタグ（繰り返しBRとか、空のpとか・・）を挿入してしまうからなのです。 【参考】HTMLエディタ ( http://ja.wikipedia.org/wiki/Web%E3%82%AA%E3%83%BC%E3%82%B5%E3%83%AA%E3%83%B3%E3%82%B0%E3%83%84%E3%83%BC%E3%83%AB#HTML.E3.82.A8.E3.83.87.E3.82.A3.E3.82.BF ) とにかくまず、 はじめてのWebドキュメントづくり ( http://www.asahi-net.or.jp/%7Esd5a-ucd/www/ ) あたりから、基礎を身に着けてください。 それと仕様書(http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/cover.html)は、いつでも参照できるようにしましょう。
お礼
ありがとうございます。わかりました。
- KDASH-XP
- ベストアンサー率45% (62/135)
なんかHTML的にメチャクチャですね。 <table>～</table>で閉じてるにも関わらず、<tr></tr>以下が再登場してしまっていたりと。 やり方としてはtdタグの属性値にalign="right"をつければ、テーブルのセル内の要素が右寄せになりますので、やりたいことが実現できるかと思います。 #あと細かいですが HTMLは「Hyper Text Markup Language」ですから、「HTML言語」というのはちょっと可笑しいです。
お礼
ありがとうございます。わかりました。
補足
ご回答ありがとうございます。 提灯だけを右にしたいのですが、align="right"とやって左に行ってしまうんですが。
お礼
ありがとうございます。わかりました。