文字と枠線の距離を離す方法について
- 枠線と文字の距離を離す方法について質問があります。
- 具体的には、テーブルのセル内の枠線と文字がくっつきすぎている状態を解消したいです。
- 現在のコードでは、cellpaddingの指定が上手く働かないようです。どのように修正すれば良いでしょうか。
- ベストアンサー
文字と枠線がくっつきすぎている
たとえば、 ←枠と文字の距離を離したいのですが、どうすればいいでしょうか。 普通のテーブルでは、cellpaddingで指定しますよね。下のような場合、どうすればいいでしょうか。 <BODY bgColor=#ffffff> <DIV class=block3 style="BORDER-RIGHT: 0px solid; BORDER-TOP: 0px solid; BORDER-LEFT: 10px solid; WIDTH: 400px; BORDER-BOTTOM: 0px solid; HEIGHT: 30px">←↑ くっついてるのを離したい<BR>くっついてるのを離したい</DIV> </BODY> </html> よろしくお願いします。
- N0W
- お礼率91% (309/337)
- HTML
- 回答数1
- ありがとう数1
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
padding:10px; とかを追加してやるといいです。 padding指定は、枠から内容までの幅を指定します。
関連するQ&A
- floatとclearを使ったレイアウト作成について
http://www.ario-nishiarai.jp/ 上記のサイトのようなページ中央より下のレイアウトを作りたいと思い、下記のようにコーディングしました。 <html> <head> <title>Ｗｅｂ</title> <style type="text/css"> .container {text-align:left;width:760px;margin:0px auto;background-color:#FFFFFF;} .content1 {width:760px; height:200; padding:0px; border:1px solid #999999;} .content2 {width:760px;padding:0px;border-right:1px solid #999999; border-bottom:1px solid #999999; border-left:1px solid #999999; margin:0;} .box1 {width:180px; float:left; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .box2 {width:180px; float:left; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .box3 {width:180px; float:left; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .box4 {width:180px; float:left; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px; margin-bottom:10px;} .box5 {width:220px; float:right; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .box6 {width:220px; float:right; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .news {width:350px; height:200; overflow:auto; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;} .topics {width:350px; height:200; overflow:auto; border-top:1px solid #CCCCCC; border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; margin-top:5px; margin-left:5px;}solid #CCCCCC; margin-top:5px; margin-left:5px;} </style> </head> <body> <div class="container"> <div class="content1"> 画像 </div> <div class="content2"> <!--左側--> <div class="box1"> タイトル<br /> メニュー </div> <div class="box2"> タイトル<br /> メニュー </div> <div class="box3"> タイトル<br /> メニュー </div> <div class="box4"> タイトル<br /> メニュー </div> <!--中央--> <div class="news"> あ </div> <div class="topics"> い </div> <!--右側--> <div class="box5"> う </div> <div class="box6"> え </div> </div> </div> </body> </html> box1、box2、box3、box4のボックスは左側に、news、topicsのボックスは中央に、box5、box6のボックスは右側にレイアウトしたいと思っています。 floatとclearを使って作成するのだと思うのですが、どうコーディングしたら良いのかわかりません。 どこをどう直したら良いかアドバイスいただけますようお願いします。
- ベストアンサー
- HTML
- テーブルの線について
下記のようなＨＰをつくっています。 一番大きなテーブルの上下の線を消すにはどこをどのようにすればいいのでしょうか？ ご回答いただけると嬉しいです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS"> <title></title> <style type="text/css"> <!-- BODY TD { FONT-SIZE: 10pt } A.menu:link,A.menu:visited { BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #666666 1px solid; COLOR: #ffffff; PADDING-TOP: 12px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 40px; BACKGROUND-COLOR: pink; TEXT-DECORATION: none } A.menu:hover,A.menu:active { BORDER-RIGHT: #ffffff 1px ridge; PADDING-RIGHT: 15px; BORDER-TOP: #ffffff 1px ridge; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ffffff 1px ridge; COLOR: gray; PADDING-TOP: 12px; BORDER-BOTTOM: #ffffff 1px ridge; HEIGHT: 40px; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none } --> </style> </head> <body bottommargin="0" background="sozai/kabegami.gif" topmargin="0"> <table height="100%" cellspacing="1" cellpadding="1" width="730" align="center" bgcolor="#c0c0c0" border="0"> <tr> <td bgcolor="#ffffff" colspan="2"> </td> </tr> <tr> <td bgcolor="#ffffff" colspan="2" height="120" background="sozai/title_back.gif"> <p align="center"><img height="50" alt="" src="sozai/title.gif" width="369" border="0"></p></td> </tr> <tr> <td bgcolor="#ffffff" colspan="2" valign="top" align="left"><br> <table cellspacing="0" cellpadding="0" width="155" align="left" border="0"> <tr> <td> <table style="MARGIN-TOP: -2px; FONT-WEIGHT: bold; WIDTH: 146px; FONT-FAMILY: 'mspゴシック'; HEIGHT: 241px" cellspacing="3" cellpadding="0" width="146" align="center" border="0"> <tr> <td style="BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 10px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #666666 1px solid" align="center"><font color="gray">Ｔｏｐ</font></td> </tr> <tr> <td><a class="menu" href="">Ｎｅｗｓ</font></a></td> </tr> <tr> <td><a class="menu" href="">作品集</font></a></td> </tr> <tr> <td><a class="menu" href="">お教室情報</font></a></td> </tr> <tr> <td><a class="menu" href="">Ｓｈｏｐｐｉｎｇ</a></td> </tr> <tr> <td><a class="menu" href="">お友達サイト</a></td> </tr> </table> <p align="center"> <img src="http://counter1.fc2.com/counter_img.php?id=47426"><br> </p></td></tr></table> <table cellspacing="1" bgcolor="#c0c0c0" border="0" cellpadding="20" width="565" align="left"> <tr> <td bgcolor="#ffffff" ><br> <br><br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br><br> <br> </td> </tr> </table> </td></tr> <tr> <td bgcolor="#ffffff" colspan="2"> <p align="center"> <font color="#808080">Copyright © 2005-2007 princess-ichigo, All rights reserved.</font></font></p></td> </tr> <tr> <td bgcolor="#ffffff" colspan="2"><br> </td> </tr> </table> </body></html>
- ベストアンサー
- HTML
- テーブルの中の複数行テキスト欄の下に書き込めない
またもスペースお借りします。 TOPページで使う予定の更新履歴を残す 複数行テキスト欄の下にバナーやボタンを貼りたいのですが、 なぜが外テーブルからはじき出されてしまうのです。 複数行テキスト欄の上には書き込めるのですが、 下に書き込むようにするには、どのようなタグを入力すれば良いでしょうか？ 具体的に教えてくださると助かります。 これがコピペです↓ <html> <head> <title>top</title> </head> <body background="http://背景URL"> <Basefont Size="2"> <br> <br> <table align="center"border="0" width="700" height="500" style="border:3px double #999999;" cellpadding="5" cellspacing="0"bgcolor="#ffffff"> <Tr> <Td> <br> <Td Align="left" Valign="top"> <B>●更新履歴</B> <div style="width:230px;height:130px;overflow-y:scroll"style="border:3px double #000000;" cellpadding="5" bgcolor="#ffffff"Td Align="left"Valign="bottom"> ああああ<br> ああああ<br> ああああ<br> </table> </div> <br> あああああああああ </Td> </Tr> </Table> </body> </html>
- ベストアンサー
- HTML
- ＨＴＭＬタグの質問です!詳しい方お願いします
<div style="BORDER-RIGHT: #ffffff 1px solid; BORDER-TOP: #ffffff 1px solid; OVERFLOW-Y: scroll; BORDER-LEFT: #ffffff 1px solid; WIDTH: 395px; BORDER-BOTTOM: #ffffff 1px solid; HEIGHT: 523px"></div> というタグに背景画像を入れたいのですが、 背景を動かすと後ろ(もとの背景)ごと動いてしまいます。 やっぱり不可能なのでしょうか？
- 締切済み
- その他([技術者向] コンピューター)
- あるソースをあるソースに埋め込みたい
http://www.1uphp.com/con2/menu/tab41.html このURLの一番下の「全ての書き方」を 下記のソースのメニューの右にあるテーブルに埋めたいと思っています。 しかし、上記URLのソースのスタイルシート部分を書きのソースへコピペした段階で 下記のソースのページが全て左寄せみたいになってしまいます。 どこをどう記述すれば埋め込めるでしょうか？ <html> <head> <style type="text/css"> <!-- A.menu:link,A.menu:visited { BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #666666 1px solid; COLOR: #ffffff; PADDING-TOP: 12px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 40px; BACKGROUND-COLOR: pink; TEXT-DECORATION: none } A.menu:hover,A.menu:active { BORDER-RIGHT: #ffffff 1px ridge; PADDING-RIGHT: 15px; BORDER-TOP: #ffffff 1px ridge; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ffffff 1px ridge; COLOR: gray; PADDING-TOP: 12px; BORDER-BOTTOM: #ffffff 1px ridge; HEIGHT: 40px; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none } TABLE#mainTable { BORDER-RIGHT: #c0c0c0 1px solid; BORDER-TOP: #c0c0c0 1px solid; BORDER-LEFT: #c0c0c0 1px solid; BORDER-BOTTOM: #c0c0c0 1px solid; BORDER-COLLAPSE: collapse } TD.borderAll,TD.borderNoTop,TD.borderNoBottom { BORDER-RIGHT: #c0c0c0 1px solid; BORDER-TOP: #c0c0c0 1px solid; BORDER-LEFT: #c0c0c0 1px solid; BORDER-BOTTOM: #c0c0c0 1px solid } --> </style> </head> <body bottommargin="10" background="sozai/kabegami.gif" topmargin="10"> <table height="1817" width="730" align="center" id="mainTable" style="WIDTH: 730px; HEIGHT: 1817px"> <tr> <td colspan="2" class="borderNoTop" bgcolor="#ffffff" height="20" ></td> </tr> <tr> <td colspan="2" height="120" class="borderAll" background="sozai/title_back.gif"><strong><font color="#ff0000" size="5"></font></strong></td> </tr> <tr> <td class="borderAll" colspan="2" valign="top" align="left" bgcolor="#ffffff"><br> <table cellspacing="0" cellpadding="0" width="155" align="left" border="0"> <tr> <td bgcolor="#ffffff"> <table style="MARGIN-TOP: -2px; FONT-WEIGHT: bold; WIDTH: 146px; FONT-FAMILY: 'mspゴシック'; HEIGHT: 241px" cellspacing="3" cellpadding="0" width="146" align="center" border="0"> <tr> <td><a class="menu" href="index.html" >Ｔｏｐ</font></a></td> </tr> <tr> <td><a class="menu" href="1_news.html" >Ｎｅｗｓ</font></a></td> </tr> <tr> <td><a class="menu" href="2_sakuhin.html" >作品集</font></a></td> </tr> <tr> <td style="BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 10px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #666666 1px solid" align="center"><font color="gray">お教室情報</font></td> </tr> <tr> <td><a class="menu" href="5_shop.html" >Ｓｈｏｐｐｉｎｇ</a></td> </tr> <tr> <td><a class="menu" href="6_link.html" >お友達サイト</a></td> </tr> <tr> <td><a class="menu" href="7_mail.html" >Ｍａｉｌ</a></td> </tr> </table> <p align="center"> <font ><font color="#808080" size="1" > <font ><font size="2"> <br></font></font> </p></font></font></td></tr></table> <table style="WIDTH: 560px; HEIGHT: 1380px" cellspacing="1" cellpadding="20" width="560" align="left" bgcolor="#c0c0c0" border="0"> <tr> <td valign="top" align="left" bgcolor="#ffffff"> <p align="left"><font color="#808080"></font> </p></td></tr></table> </td></tr> <tr> <td class="borderAll" colspan="2" bgcolor="#ffffff" height="20"> <p align="center"> </p></td> </tr> <tr> <td colspan="2" class="borderNoBottom" bgcolor="#ffffff" height="20" > </td> </tr> </table> </body></html>
- 締切済み
- HTML
- firefoxでdivタグ要素が突き抜ける
お世話になります。 firefoxですとdivタグで指定した高さ・幅を要素が超えると 突き抜けて表示されます。IEだと、指定した幅・高さが大きくなってくれる。 以下のソースで子の要素が親のボックス、子のボックスを突き抜けなくできないでしょうか？ もしかしたら簡単なことなのかもしれませんが、 ご教授よろしくお願いいたします。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> #oya { border-right:orange 1px solid; border-top:orange 1px solid; border-left:orange 1px solid; border-bottom:orange 1px solid; } #ko { border-right:green 1px solid; border-top:green 1px solid; border-left:green 1px solid; border-bottom:green 1px solid; } </style> </head> <body> <div id="oya" style="width:200px;height:200px;"> <div id="ko" style="width:100px;height:100px;">ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ<br>ほげ</div> </div> </body> </html>
- ベストアンサー
- HTML
- 中枠の太さを1pxにしたい
以下の HTML を書いたのですが、外枠の太さは1pxになっていますが、中枠が2pxになってしまいます。中枠も1pxで表示するにはどう修正すればいいでしょうか？ ご教授よろしくお願い致します。 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>test</title> </head> <body> <table border="0" width="100%" cellspacing="0" cellpadding="0" id="table2"> <tr> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;">Icon</div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;">Name</div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;">Effect</div></div></td> </tr> <tr> <td width="33"><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;"> <img border="0" src="test.gif" width="35" height="32"></div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 111111</div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 444444</div></div></td> </tr> <tr> <td width="33"><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;"> <img border="0" src="test.gif" width="35" height="32"></div></div></td> <td align="left"><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 222222</div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 555555</div></div></td> </tr> <tr> <td width="33"><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px;"> <img border="0" src="test.gif" width="35" height="32"></div></div></td> <td align="left"><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 333333</div></div></td> <td><div style="border:1px solid #999999"> <div style="BORDER-TOP: 1px solid;BORDER-RIGHT: 1px solid;BORDER-BOTTOM: 1px solid;BORDER-LEFT: 1px solid;padding:3px; height:40"> 666666</div></div></td> </tr> </table> </body> </html>
- ベストアンサー
- HTML
- div枠のレイアウトが崩れてしまいます
２×２段の枠を作るために、下のような段組にしました。 100％表示ではうまく表示するのですが、ウィンドウを縮小すると、 div要素が勝手に改行してしまい、レイアウトが崩れてしまいます。 同じような質問を参考にして、"wrap"の幅設定をしてみたり、 div要素に｛position:relative;}を追加してみたりしましたが、 どれもうまくいかず、縮小でレイアウトが崩れます。 ウィンドウを縮小してもレイアウトが崩れないようにする方法はあるでしょうか？ それと、もう１つ質問があります。 右上の枠内の画像を「枠内の右下」に表示したいのですが、よい方法はありますか？ {text-align:right;}で横位置は移動できたのですが、縦位置がうまく設定できません。 画像自体に｛potision:absolute;}{top:**}{left:**｝で指定すると、 またウィンドウの倍率変更でとんでもないところに表示されてしまいます。 【html】 <body> <div id="wrap"> <img src="image/title.gif"> <div id="left-up">あああ</div> <div id="right-up"><img src="logo.jpg"></div> <br class="clear"> <div id="left-down">いいい</div> <div id="right-down">ううう</div> </div> <!-- /wrap--> </body> 【css】 #wrap{ width: 945px; height: 700px; padding: 0px; border: 1px #202020 solid; margin: 0 auto; text-align: left; } #left-up{ width: 160px; height: 80px; border-top: 1px solid #606060; border-right: 1px solid #606060; float: left; } #right-up{ width: 780px; height: 80px; border-top: 1px solid #606060; float: left; } .clear{ clear: left; } #left-down{ width: 160px; height: 500px; border-top: 1px solid #606060; border-right: 1px solid #606060; border-bottom: 1px solid #606060; float: left; } #right-down{ width: 780px; height: 500px; border-top: 1px solid #606060; border-bottom: 1px solid #606060; float: left; } よろしくお願いいたします。 そもそも、この枠組みの仕方が無謀であれば、何かよい方法を教えていただけないでしょうか。 重ね重ね申し訳ありません。
- ベストアンサー
- HTML
- CSS 左右違う大きさのボックスでheightを合わせたい
外部CSSでHPを作成しています。 基本的なことかと思いますが、調べてもどうしてもうまくいかないので 皆さまのお力をお貸しください。 左右にボックス（で良いのでしょうか？）を置き、その中にテキストを入れています。 それぞれ文字数が違うためheightのサイズがばらばらのため、現在指定していません。 固定すれば解決しそうですが、縦には数十個のボックスを並べているのでできません。 どのようにしたら文字数の少ないボックスを、文字数の多いボックスに合わせられるのでしょうか？ また、テキストを何も入れていない状態で、左右のheightがずれているのはなぜなのでしょうか？ どうぞご教授ください。 よろしくお願い致します。 /*CSSファイルの記述*/ .waku1{ border : solid 1px #999999; border-bottom: none; width :150px; float : left; background-color : #e8e8e8; line-height: 160%; } .waku2{ border : solid 1px #999999; border-left: none; border-bottom: none; width :335px; line-height: 160%; word-break: break-all; } .waku3{ border : none; border-bottom: solid #999999 1px; border-top: solid #999999 1px; width :150px; float : left; background-color : #e8e8e8; line-height: 160%; } .waku4{ border : none; border-bottom: solid #999999 1px; border-top: solid #999999 1px; border-left: none; border-bottom: none; width :335px; line-height: 160%; word-break: break-all; } .clear{ clear : left; } /*HTMLファイルの記述*/ <div class="waku1"></div> <div class="waku2"></div> <div class="clear"></div> <div class="waku1"></div> <div class="waku2"></div> <div class="clear"></div> <div class="waku1"></div> <div class="waku2"></div> <div class="clear"></div> <div class="waku3"></div> <div class="waku4"></div> <div class="clear"></div>
- ベストアンサー
- HTML
- ※再度※どこが悪いのかみていただきたいです。
以前あまり回答が得られなかったので カテを変えて、再度お願いいたします。 下記のようなHPをフリーソフトの「alphaEDIT」で作りました。 一番外側のテーブルの上下を画面の上下いっぱいに引っ付けたいと思っています。 プレビューでこのソースのページを見るとちゃんと上下にくっついているのですが アップロードしてインターネット上で見ると上はくっついているのですが 下がくっついていないのです。 これがなぜなのかわかる方は、教えていただきたいです。 HP初心者なのでできるだけわかりやすく教えていただけるとうれしいです。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=SHIFT_JIS"> <title></title> <style type="text/css"> <!-- BODY TD { FONT-SIZE: 10pt } A.menu:link,A.menu:visited { BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #666666 1px solid; COLOR: #ffffff; PADDING-TOP: 12px; BORDER-BOTTOM: #666666 1px solid; HEIGHT: 40px; BACKGROUND-COLOR: pink; TEXT-DECORATION: none } A.menu:hover,A.menu:active { BORDER-RIGHT: #ffffff 1px ridge; PADDING-RIGHT: 15px; BORDER-TOP: #ffffff 1px ridge; DISPLAY: block; PADDING-LEFT: 15px; PADDING-BOTTOM: 5px; BORDER-LEFT: #ffffff 1px ridge; COLOR: gray; PADDING-TOP: 12px; BORDER-BOTTOM: #ffffff 1px ridge; HEIGHT: 40px; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none } table#mainTable{ border-collapse:collapse; } td.borderAll,td.borderNoTop,td.borderNoBottom{ border:solid 1px #c0c0c0; } td.borderNoTop{ border-top:0px; } td.borderNoBottom{ border-bottom:0px; } --> </style> </head> <body bottommargin="0" background="sozai/kabegami.gif" topmargin="0"> <table height="956" width="730" align="center" id="mainTable" style="WIDTH: 730px; HEIGHT: 956px"> <tr> <td colspan="2" class="borderNoTop" bgcolor="#ffffff" height="20" ></td> </tr> <tr> <td colspan="2" height="120" class="borderAll" background="sozai/title_back.gif"> <p align="center"><font color="#ff0000" size="5"><strong> </strong></font> </p></td> </tr> <tr> <td class="borderAll" colspan="2" valign="top" align="left" bgcolor="#ffffff"><br> <table cellspacing="0" cellpadding="0" width="155" align="left" border="0"> <tr> <td bgcolor="#ffffff"> <table style="MARGIN-TOP: -2px; FONT-WEIGHT: bold; WIDTH: 146px; FONT-FAMILY: 'mspゴシック'; HEIGHT: 241px" cellspacing="3" cellpadding="0" width="146" align="center" border="0"> <tr> <td><a class="menu" href="index.html" >Ｔｏｐ</font></a></td> </tr> <tr> <td><a class="menu" href="1_news.html" >Ｎｅｗｓ</font></a></td> </tr> <tr> <td><a class="menu" href="2_sakuhin.html" >作品集</font></a></td> </tr> <tr> <td><a class="menu" href="4_kyoushitsu.html" >お教室情報</a></td> </tr> <tr> <td style="BORDER-RIGHT: #666666 1px solid; PADDING-RIGHT: 15px; BORDER-TOP: #666666 1px solid; PADDING-LEFT: 15px; PADDING-BOTTOM: 10px; BORDER-LEFT: #666666 1px solid; PADDING-TOP: 10px; BORDER-BOTTOM: #666666 1px solid" align="center"><font color="gray">Ｓｈｏｐｐｉｎｇ</font></td> </tr> <tr> <td><a class="menu" href="6_link.html" >お友達サイト</a></td> </tr> <tr> <td><a class="menu" href="7_mail.html" >Ｍａｉｌ</a></td> </tr> </table></td></tr></table> <table style="WIDTH: 560px; HEIGHT: 748px" cellspacing="1" cellpadding="20" width="560" align="left" bgcolor="#c0c0c0" border="0"> <tr> <td valign="top" align="left" bgcolor="#ffffff"> </td></tr></table> </td></tr> <tr> <td class="borderAll" colspan="2" bgcolor="#ffffff" height="20"> <p align="center"> <font color="#808080">Copyright © 2005-2007 princess-ichigo, All rights reserved.</font></font></p></td> </tr> <tr> <td colspan="2" class="borderNoBottom" bgcolor="#ffffff" height="20" > </td> </tr> </table> </body></html>
- 締切済み
- ホームページ作成ソフト
お礼
こんな単純なことだったとは…(^^;; すみません、ありがとうございました。