締切済み

テーブルの位置

2003/09/22 00:35

はじめまして。ＨＰを作っているのですが、行き詰ったので質問させて下さい。ずばりテーブルの位置なのですが、どこを調べても alignで指定する方法しか出てきません。極端に右、左ではなく真ん中より少し右上に置きたいのですが、これは簡単にＨＴＭＬでは指定出来ないのでしょうか？教えて下さると嬉しいです。よろしくお願いします。

rodge
お礼率21% (3/14)

HTML
回答数6
ありがとう数4

みんなの回答 （6）
専門家の回答

みんなの回答

noname#199778

2003/09/22 17:40 回答No.6

positionプロパティを使う場合は、先に挙げられている絶対配置(absolute)以外に相対配置(relative)で配置する方法もあります。 <table style="position: relative; top: -5px; left: 40%;"> このような指定にすると、本来スタイルシート指定を入れないときにそのテーブルが配置される位置を基準として、そこからtopやleft(もしくはbottom、right)で指定しただけ表示位置を移動させることができます。すでにページが作られていて、表示位置をこれから調整したいというケースでは、こちらの方が手軽に調整できるかもしれません。 position: absolute;で指定する場合は、topやleftなどの座標位置を指定する基準位置の取り方がファイルの先頭位置になるので、その点の注意が必要でしょう。この表示位置を調整するテーブル以外の内容があるページで使う場合には、座標の調整が少々面倒になることもあるかもしれません。ついでに、スタイルシートでの座標はパーセントでも指定できますので、ウィンドウサイズに追従するデザインの場合はそちらの方が楽に指定できるかもしれませんね。他には、marginプロパティでも代用できるかも知れません。 <table style="margin-top: -15px; margin-left: 45%;"> 状況次第ですが、このような指定でも、表示位置を調整できるでしょう。参考まで…

ログインすると、全ての回答が全文表示されます。

noname#10926

2003/09/22 01:41 回答No.5

<HTML> <HEAD> <META http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <META http-equiv="Content-Style-Type" content="text/css"> <TITLE>ここにタイトル名</TITLE> </HEAD> <BODY> <table border="0" cellpadding="0" cellspacing="0" style="position : absolute;top : 20px;left : 500px;"> <TBODY> <TR> <TD><IMG src=・・・><TD> <TD></TD> </TR> <TR> <TD></TD> <TD></TD> </TR> </TBODY> </TABLE> </BODY> </HTML> よって <META http-equiv="Content-Style-Type" content="text/css"> これは <HEAD>～</HEAD>の間に <!-- ←これは無くても良い

ログインすると、全ての回答が全文表示されます。

bear-3
ベストアンサー率42% (26/61)

2003/09/22 01:39 回答No.4

こんにちは。既に返答されているように。スタイルシートを使用するしか、細かなテーブル位置指定は出来ないと思われます。スタイルシートの使い方などについては、下に載せましたURLを参考にされたら良いかと思います。ここは大変分かり易いです。ワタシもよく利用しています。で一応簡単にスタイルシートの概要を述べさせていただきます。スタイルシートを適用するには、主に三つの方法があります。　１：スタイルシートを記述した別のファイルを読み込む。　２：スタイルシートをHTMLのヘッダ部分に書いておく。　３：タグ内部に直接書く。今回の場合は、３の方法をとられるとよろしいかと思います。例としては、以下のようになります。 <table style="position : absolute;top : 20px;left : 500px;"> <tr><td nowrap> テーブルの中身。 </td></tr> </table> あと  </style> </head>  で囲まれた範囲はHTML書式上コメントとして扱われますので、ブラウザは無視します。最後にスタイルシートは便利なのですが、ブラウザによっては対応していない命令がいくつかあるようです。表示確認を怠らないようガンバッテください。こんな感じで　よろしいでしょうか？

参考URL：: http://tohoho.wakusei.ne.jp/css/index.htm

ログインすると、全ての回答が全文表示されます。

acidend
ベストアンサー率35% (27/76)

2003/09/22 01:30 回答No.3

#2ですが、#1さんへのお礼を見て配置させたいものがimgだとわかったのでもうひとつのやり方を。 imgの縦の隙間の指示であるvspaceと、横の指示であるhspaceを使うとimgの画像サイズはそのままに、エリア幅だけを広げる事ができます。 <td width="500" align="right"><img src="xxxxxxx.gif" width="200" height="200" vspace="50" hspace="70"> </td> この数値をいじって好きな間隔を見つけてください。ではでは。

ログインすると、全ての回答が全文表示されます。

acidend
ベストアンサー率35% (27/76)

2003/09/22 01:21 回答No.2

<table>タグの中のcellpaddingとcellspacingというもののどちらかの数値を通常の０でなく数値を入れていくとtd内の隅っこから実際に表示される位置までの隙間を広げる事が出来ます。例えばtdの幅が100pxでcellpaddinngかcellspacingのどちらかの数値を20にすると、tdの端っこから20px内側の四方が表示エリアとなり、100px - 20px = 80px四方角のエリアが表示エリアになります。 <table width="100" border="0" cellpadding="2" cellspacing="3"> <tr> <td align="right" valign="top">おきたいもの</td> </tr> </table> という感じです。おっしゃっている事はこれで良いでしょうか。頑張ってください。

ログインすると、全ての回答が全文表示されます。

noname#10926

2003/09/22 00:45 回答No.1

スタイルシートを使って <TABLE border="1" style="position : absolute;top : 20px;left : 500px;"> こんな感じで出来るようです。

質問者

お礼 2003/09/22 01:14

早速の回答、ありがとうございます。スタイルシートを使うんですね。実際にやってみたのですが、スタイルシートが上手くつかえません・・・。 <body bgcolor="#FFFFFF"> <style type="text/css"> <!-- 「←これの置く場所が？です。テーブルタグ自体を挟むのでしょうか？」 <table border="0" cellpadding="0" cellspacing="0" style="position : absolute;top : 20px;left : 500px;"> > <tr> <td width="10"><img ・・・省略申し訳ありませんが、これから先もアドバイス頂けると嬉しいです。スタイルシートのサイトを回っているのですが、なかなか思うようには出来ず…（汗）

ログインすると、全ての回答が全文表示されます。