HTMLでホームページを作っています。
テーブルを横に二つ並べたいのですが、二つ目のテーブルはどうしても最初のテーブルの下の段になってしまいます。どうしたら横に並べることができますか?
教えていただければ幸いです。
よろしくお願いします。

A 回答 (3件)

2列のテーブルを作ったらいかがでしょうか?


<table>
<tr>
<td>1つめのテーブルに入れる内容</td>
<td>2つめのテーブルに入れる内容</td>
</tr>
</table>

それぞれのテーブルをそのまま使いたいならば、
↑のテーブルのセルの中に、それぞれ入れれば2つ並びます。
<table>
<tr>
<td><table>←1つめのテーブル→</table></td>
<td><table>←2つめのテーブル→</table></td>
</tr>
</table>
    • good
    • 7

直接HTMLタグを打っていらっしゃるなら、スタイルシート(CSS)を使ってはいかがでしょう?


レイアウトのためにテーブルを使用するのは、あまり良いことではありませんし。

一つ目のテーブルに「float:left;」を指定すれば、そのテーブルが左側に寄って、次のテーブルが右隣に来ます。
(他にfloat:right;などもあります。この辺は参考URLを読んでください)

htmlの中にCSSを書くならこんな感じです。
<table style="float:left;"><tr><td>左側に来るテーブル</td></tr></table>
<table><tr><td>右側に来るテーブル</td></tr></table>

 #分かりやすくするために、列も行も1つにして、テーブルの他の設定も省きましたが
 #その辺は適宜改変して下さい。

この2つのテーブルをさらに中央に寄せたい…とかの場合は、
さらにdivか何かでくくって設定する必要があると思います。
そのあたりはスタイルシートを勉強してみて下さい。
最初は面倒かも知れませんが、慣れると楽ですよ~。

参考URL
http://www.tohoho-web.com/css/basic.htm
http://www.tohoho-web.com/css/reference.htm#float

参考URL:http://www.tohoho-web.com/css/basic.htm,http://www.tohoho-web.com/css/reference.htm#float
    • good
    • 1
この回答へのお礼

ありがとうございます!!
出来ました!

お礼日時:2005/05/10 15:00

<table>


<tr>
<td>
左のテーブルのソース
</td>
<td>
右のテーブルのソース
</td>
</tr>
</table>

こんな感じです。
ふつうに並べると下にくるのは、そういう仕様だからです。
    • good
    • 0
この回答へのお礼

早速の回答ありがとうございます。
私の質問が悪かったみたいです。
イメージとしては、ワードやエクセルのテキストボックスを横に2つ作りたいのです。
1つ目と2つ目には多少のスペースを空けて。
回答頂いたものは、1つのテーブルという考えです。
ですから、このHTMLを2つ連続で入力すれば横に2つ並べばいいんですけど、どうしても上下に並んでしまうので、何か方法は無いかと思い質問させていただきました。
お手数ですが、また回答頂けると助かります。よろしくお願いいたします。

お礼日時:2005/05/10 07:20

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

QOutperform? Underperform?

Outperform? Underperform?

素朴でド素人な質問で恐縮です。
1.株の世界でoutperform、underperformと使いますね。株の世界は全く未知ですが、特定の銘柄の利回りが良くなりそうなときにoutperformといい、逆がunderperformと言うようですね。
その理解でよいのですね?

2.なんでoutperformのoutとunderperformのunderが対になるのでしょうかね?outとinの対、overとunderの対なら分かるのですが、お馬鹿な質問ですが、なんででしょうかね?

3.株以外にもこの言葉は使いますよね?どんな使い方しますか?

Aベストアンサー

outperform は 「抜きん出る」 という普通の使い方からの転用で、underperform の方は活動が鈍いという意味の語からの転用と思われます。
後者の場合、標準よりも 「下回る」 という意味合いがあると思われます。標準より上は 「普通」 の領域で、それに 「達しない」 ということを意識して under- が付いたものと想像します。
前者は、「普通」 の範囲を 「外れている」 というところから out- が付いたもので、両者は in と out とか、over と under とか、そういう対置の意識から用いられたのではないのだろうと考えます。

QHTMLで書かれた二つの表をブログで横に並べたいのですが…

こんばんは。

ブログの中で、HTMLで書かれた表(テーブル?)を横に並列に並べたいのですが、
どうしてもタテ(上下)に並んでしまい、困っています。

ブログのエントリ部分の横幅は、十分にありますので、
あとはHTMLの記述でどうにかならないかと思っているのですが…。

以下に、ソースを貼りつけておきます。
これは表(テーブル)一つ分のソースで、
これと同じような表を、もう一つヨコに並べたいのです。

ちなみに、こういったサイトで作成した表(サッカーのフォーメーション)です。
http://tf.loopshoot.com/

なお、ブログはMovable Typeを使用しています。

どうぞよろしくお願いいたします。


<!-- TextFormations -->
<div style="text-align:center; margin:0; width:200pt; font-size:9.0pt;" >
アルビレックス新潟 (J1 6節 vsサンフレッチェ広島)
</div>
<div id="fhead" style="margin:0 ;padding: 15pt 3pt 8pt 3pt; border: 1px solid rgb(0,102,255); background: rgb(255,255,255); color:#666; width:200pt;">
<table id="f_table" border="0" cellpadding="0" cellspacing="0" style=" color:#666; border-collapse:collapse; table-layout:fixed; width:200pt; font-size:9.0pt; ">
<!-- FW -->
<tr style="height:13.5pt;">
<td > </td>
<td colspan="2" id="tb_10" style="text-align:center;vertical-align:top; padding:1pt 20pt;" >
16.大島秀夫(20.チョ・ヨンチョル)
</td>
<td > </td>
</tr>
<tr style="height:20.5pt;">
<td colspan="2" id="tb_9" style="text-align:left; vertical-align:top; padding:1pt 25pt 1pt 10pt;">
9.ペドロ・ジュニオール
</td>
(途中、略)
<!-- GK -->
<tr style="height:13.5pt;">
<td > </td>
<td colspan="2" style="text-align:center;padding:1pt 20pt;" >
1.北野貴之
</td>
<td > </td>
</tr><!-- GK fini -->
</table>
</div>
<div id="tfooter" style="letter-spacing:normal; text-align:center; width:200pt; margin:0; font-size:8.5pt; ">
created by
<a href="http://tf.loopshoot.com/" target="_blank">
:TextFormations</a>
<a href="http://tf.loopshoot.com/more_info.pl?fid=1p356tq5ZH" target="_blank">
:more info
</a>
<a href="http://tf.loopshoot.com/members.pl?fid=1p356tq5ZH" target="_blank">
:R</a>
</div>

こんばんは。

ブログの中で、HTMLで書かれた表(テーブル?)を横に並列に並べたいのですが、
どうしてもタテ(上下)に並んでしまい、困っています。

ブログのエントリ部分の横幅は、十分にありますので、
あとはHTMLの記述でどうにかならないかと思っているのですが…。

以下に、ソースを貼りつけておきます。
これは表(テーブル)一つ分のソースで、
これと同じような表を、もう一つヨコに並べたいのです。

ちなみに、こういったサイトで作成した表(サッカーのフォーメーション)です。
http...続きを読む

Aベストアンサー

>この表の間に少しスペースを作るにはどう記述したらいいのでしょうか??

大枠の<td>にstyle属性を当てて、paddingで余白を作ります。
つまり、<td style="padding:0px Ypx 0px 0px">
または<td style="padding:0px 0px 0px Xpx">として、

<table>
<tr><td style="padding:0px Ypx 0px 0px">
   <table>
   <tr><td>1</td></tr>
   <tr><td>2</td></tr>
   </table>
</td><td style="padding:0px 0px 0px Xpx">
   <table>
   <tr><td>3</td></tr>
   <tr><td>4</td></tr>
   </table>
</td></tr>
</table>

とおくと、Yの値分だけ左表の右側に、Xの値分だけ右表の左側に余白が作られます。
好きな値を入れて、好きなだけ余白をとってください。
たとえば、30と入れれば、30px分だけ余白ができます。

なお、padding:~px ~px ~px ~pxは、左側から順番にいって、
上・右・下・左 側の余白を大枠の<td>~</td>の内部につくります。

>この表の間に少しスペースを作るにはどう記述したらいいのでしょうか??

大枠の<td>にstyle属性を当てて、paddingで余白を作ります。
つまり、<td style="padding:0px Ypx 0px 0px">
または<td style="padding:0px 0px 0px Xpx">として、

<table>
<tr><td style="padding:0px Ypx 0px 0px">
   <table>
   <tr><td>1</td></tr>
   <tr><td>2</td></tr>
   </table>
</td><td style="padding:0px 0px 0px Xpx">
   <table>
   <tr><td>3</td></tr>
   <tr><td>4</td></tr>...続きを読む

Qbeneathとunderの違いがどうしてもわかりません。

beneathとunderの違いがどうしてもわかりません。解説書によって書いてることが違うのはなぜ?ですか。
「この建物の地下には徳川秘宝が眠っている」の文でなぜbeneathなのでしょうか?underじゃだめですか?
「あの看板の下に立ってる人だよ」のときなぜbeneath?
underじゃだめですか?
それと、underneathもあります。これはunderとどう違いますか?

Aベストアンサー

このような場合、大型辞典と英英辞典を調べるのが一番よいと思います。また、類語辞典や用例辞典で例文をあたり、理解を深めるようにするといっそう効果的です。また例文がある場合は、その例文が持っている意味合いはすべて用法に反映されているものとして、活用できます。「under a tree」という例文があったとき、「木の枝の下で枝に覆われて」という意味がunderの理解の手助けとして含まれています。

以下、参考になりそうな辞書をリストしましたので、図書館などで調べられてはいかがでしょうか。
1. Collins COBUILD English Dictionary for Advanced Learners (輸入CD ROM版)
2. Oxford Advanced Learner’s Dictionary (OALD: オックスフォード現代英英辞典[開拓社])
3. Practical English Usage (オックスフォード実例現代英語用法辞典[研究社出版])
4. Webster’s New Dictionary of Synonyms (ウエブスター同義語辞典[丸善])

4で[below]の項を引くと次のようにでています。(原文は英文ですので要訳してあります)

Below, under, beneath, underneath は、他のものあるいは他の位置にくらべて相対的に低い位置にあることを意味する。

Below(aboveの反対語)は、直下に限らずある物よりも低いところに位置している物に用いる。

Under(overの反対語)は、上下方向の意味で下のほう(below)にある物に用い、その物が他の何物かによって覆われているという含みがある。

Beneathはbelowとunderのいずれとも同等の意味である。

Underneathはunderやbeneathの代わりに用いられることが多い。ただし全面的ないしはほぼ全面的な隠蔽状態を暗示したい場合に、underneathを使うのが望ましい。

これから見ますと、underで表した徳川財宝はその足許だけに存在するような感じになります。これをbeneathで表せば「この下一帯に(広がって)存在している」というニュアンスになるのではないでしょうか。看板の下の人は、underでもよいと思いますが、underの「上下方向での下」を嫌ってbeneathにしたのではないでしょうか。

以上ご参考になれば幸いです。

このような場合、大型辞典と英英辞典を調べるのが一番よいと思います。また、類語辞典や用例辞典で例文をあたり、理解を深めるようにするといっそう効果的です。また例文がある場合は、その例文が持っている意味合いはすべて用法に反映されているものとして、活用できます。「under a tree」という例文があったとき、「木の枝の下で枝に覆われて」という意味がunderの理解の手助けとして含まれています。

以下、参考になりそうな辞書をリストしましたので、図書館などで調べられてはいかがでしょうか。
1. Col...続きを読む

Qテーブルの横並び

HTMLで、各テーブルを横並びにする方法を探しています。

<table><tr>
<td>【画像】</td>
<td>【画像】</td>
<td>【画像】</td>

上記で横並びにはなるのですが、一つの枠に仕切りが入っている状態です。

これを
-------------------
□□□ ←横並びになった枠の間にはスペースが空いてます。
-------------------
上記のように、それぞれがテーブルで区切られ横並びにするようにはできないでしょうか。

もしくは枠の表示を消したりして、そういう風に見せられるように出来ないでしょうか。


あるブログで見てから、色々と試行錯誤をしたものの自己解決には至りませんでした。

Aベストアンサー

ブログで画像を横に並べたい場合、ただ単に画像を指定する <img> タグを半角スペースで区切って並べるだけで横並びになりますが・・・。そういうことではないのでしょうか。

<img src="画像1のURL"> <img src="画像2のURL"> <img src="画像3のURL">

これで、画像3枚が横並びに表示され、間にスペースが入ります。

あるいは、そのブログで画面を右クリックして、ソースページを表示してみたら、どういうコードになっているか分かるのでは?

Qunderをどう訳すか?

You are under no obligation to buy this.

この英文は、「あなたはこれを買う義務がない」というニュアンスだと思うのですが、
underをどう訳すかがひっかかります。
underをどう訳しますか?

Aベストアンサー

under an obligation to ~
で、「~する義務がある」という熟語になっているようです。

それはわきへ置いておいて、ガチガチの直訳をすると、

あなたは、これを買うべき義務のもとにはいない。

まあ、ふつう、こんな表現はしないでしょうけれどね。

Qテーブルタグ表示が上手くいかない(html・CSS

下のタグを使うと、ブログに下記画像上部のように表示されているのですが
理想としては画像の下部分のように綺麗に表示したいです。
自分なりに何度かタグを弄っているのですが何度やっても画像上部のように乱れて表示されてしまい
ムキー!っとなってます。
大変申し訳ないのですが、画像の下部分のように表示できるタグを教えてください。
何卒お願いします。

画像内のピンクの部分は実際には<img src="で指定された画像になります。

使ったタグ


<table border="1">
<td><table id="table-03">
<colgroup>

</colgroup><tr>
<td><a href="jpg"><img src="i.jpg" alt="" width="150" height="220" class="aligncenter size-full wp-image-227" /></a></td>
<td><table id="table-03">
<colgroup>

</colgroup>
<tr>
<tr><td>あああ名</td>
<td>いいい</td>

</tr>
<tr>
<td>ううう</td>
<td>えええ</td>
</tr>
<tr>
<td>おおお</td>
<td>かかかかか~</td>
</tr>
</table></td>
</tr>
</table>
</DIV>

</colgroup><tr>
<td><a href="jpg"><img src="i.jpg" alt="" width="150" height="220" class="aligncenter size-full wp-image-227" /></a></td>
<td><table id="table-03">
<colgroup>

</colgroup>
<tr>
<tr><td>あああ名</td>
<td>いいい</td>

</tr>
<tr>
<td>ううう</td>
<td>えええ</td>
</tr>
<tr>
<td>おおお</td>
<td>かかかかか~</td>
</tr>
</table></td>
</tr>
</table>
</DIV>

下のタグを使うと、ブログに下記画像上部のように表示されているのですが
理想としては画像の下部分のように綺麗に表示したいです。
自分なりに何度かタグを弄っているのですが何度やっても画像上部のように乱れて表示されてしまい
ムキー!っとなってます。
大変申し訳ないのですが、画像の下部分のように表示できるタグを教えてください。
何卒お願いします。

画像内のピンクの部分は実際には<img src="で指定された画像になります。

使ったタグ


<table border="1">
<td><table id="table-03">
<colgroup>

...続きを読む

Aベストアンサー

タグを「インデント」してみましょう。

すると「タグがちゃんと閉じられてない」のが判ります。

<table border="1"> /*このタグが閉じてない*/
 <td> /*このタグが閉じてない*/
  <table id="table-03">
   <colgroup>

   </colgroup>
   <tr>
    <td><a href="jpg"><img src="i.jpg" alt="" width="150" height="220" class="aligncenter size-full wp-image-227" /></a></td>
    <td>
     <table id="table-03">
      <colgroup>

      </colgroup>
      <tr> /*このタグが閉じてない*/
       <tr>
        <td>あああ名</td>
        <td>いいい</td>

       </tr>
       <tr>
        <td>ううう</td>
        <td>えええ</td>
       </tr>
       <tr>
        <td>おおお</td>
        <td>かかかかか~</td>
       </tr>
      /*ここに</tr>の閉じタグが必要なのでは?*/
     </table>
    </td>
   </tr>
  </table>
 /*ここに</td>の閉じタグが必要なのでは?*/
/*ここに</table>の閉じタグが必要なのでは?*/
</DIV>/*開始タグがない*/

ちゃんとインデントして、使ったタグがちゃんと閉じてるか確認しましょう。

タグがちゃんと閉じてなければ、ムキーッ!となるのが当たり前です。

なお、ムキーッ!って思ってるのは貴方じゃなく、タグがちゃんと閉じられてない変なページを表示させられている「ブラウザさん」ですよ。

タグを「インデント」してみましょう。

すると「タグがちゃんと閉じられてない」のが判ります。

<table border="1"> /*このタグが閉じてない*/
 <td> /*このタグが閉じてない*/
  <table id="table-03">
   <colgroup>

   </colgroup>
   <tr>
    <td><a href="jpg"><img src="i.jpg" alt="" width="150" height="220" class="aligncenter size-full wp-image-227" /></a></td>
    <td>
     <table id="table-03">
      <colgroup>

      </colgroup>
     ...続きを読む

Qunderの使い方

Mr.Jackson woke up early to ensure that he would start his day ( ) schedule.

(A) before (B) ahead of (C) advance (D) under

答えは(B)ahead of です。

(B) と迷って(D) のunderでスケジュールのもとに みたいに捉えてDにしてしまいました。
何故、underだと不適合なのかご教授いただきたくお願いします!!

Aベストアンサー

出題者はおそらく under schedule を選ぶ者がいるのではないかという予想を持って選択肢に入れたのではないかと思います。
ahead of schedule は schedule という語にまつわる表現の1つです。

「予定どおり」 なら on schedule
「予定より遅れて」 なら behind schedule
「予定より早く」 なら ahead of schedule

これらはいわば3点セットです (辞書にもこの3つは出ていると思います)。
英語を母国語とする人たちはそれら3つを場合に応じて使い分けているわけで、我々はそれを覚えるしかありません (無理やり、存在しない表現を作り出すつもりなら話は別ですけれども、テストの場合には実際に用いられている表現に従うしかないでしょう)。

「スケジュールのもとに」 つまり 「スケジュールにのっとって」 という意味の文にしようとすれば、on schedule という表現を選ぶことになりますが、その選択肢はないので、改めて考えてみると、「早起きした」 ということから、「予定より早め」 という意味の文ではないか、と考えると、ahead of schedule という表現がそれに合うし、選択肢にもあるということで (B) が正解ということになります。

出題者はおそらく under schedule を選ぶ者がいるのではないかという予想を持って選択肢に入れたのではないかと思います。
ahead of schedule は schedule という語にまつわる表現の1つです。

「予定どおり」 なら on schedule
「予定より遅れて」 なら behind schedule
「予定より早く」 なら ahead of schedule

これらはいわば3点セットです (辞書にもこの3つは出ていると思います)。
英語を母国語とする人たちはそれら3つを場合に応じて使い分けているわけで、我々はそれを覚えるしかありません (無理...続きを読む

Q【HTMLタグ】画像を横に連続して貼るには

画像(リンク用)を横に連続して貼るタグを教えてください。

(リンクしない画像を横に貼るタグは分かります)


よろしくお願いします。

Aベストアンサー

<a href="リンク先"><img src="画像"></a>
を並べるだけです。
ただし、幅がないと改行されてしまいますから、
テーブルタグやCSSなどを利用して幅を確保しておきます。

QUnder no circumstances can we lose the next game.

Under no circumstances can we lose the next game.
「どんなことがあっても、今度の試合に負けるわけにはいかない」

という例文がありました。

これは、
Under no circumstances / can we lose the next game.
の / の位置で切って考えれば良いのでしょうか?
(読むときは、そこで少し間を空けるのでしょうか?
 書くとき、カンマをつけても良いのでしょうか?)

また、その場合、can we となっているのは強調の倒置ですか?

もしそうなら、
Under no circumstances we can lose the next game.
でも正しいですか?
それとも、Under no circumstances とくれば、
can we と続くのが自然な流れですか?

宜しくお願いいたします。

Aベストアンサー

単なる強調ではなく、「否定的な語が文頭に現れたときの倒置」です。
詳しくは「否定 倒置」で検索すれば山のような説明が出てくるでしょう。
ここでは簡単な例だけ挙げておきます。

1.否定語が文頭に来る
I have never been to America.
 → Never have I been to America.
Not a single paper did he write.
「論文は一本も書かなかった」

2.否定的な語が文頭に来る
I seldom saw her.
 → Seldom did I see her. 彼女に会うことはめったになかった.
Only later did she realise what had happened.
「何が起きたか気づいたのは後になってからだった」

Q入門のためにあなたのブログのネタの仕入れ方教えて頂ければ幸いです

簡単なネタの仕入れ方
教えて頂ければ幸いです

アフィリエイトだけでは面白味が無く
リンクを貼りまくるのは良いのか悪いのか…
兎に角見てくれるブログを書いてみたい
とは言ってもテーマは今のところとくになく…

楽に真似しやすい(更新続けやすい)
あなたが面白いと思う
または参考にしているブログて有りますか
と言うか真似できるブログ書くテクニック
または有れば見てみたいと思うブログ
教えて頂ければ幸いです

『友達から楽天ブログを書けと言われ…
知り合い同士で相手の楽天ブログからアフィリエイトを一旦開いた後
自分の必要な物を楽天で買い物すれば他にポイントが流出せず両得と言われ
とりあえず書いてみようと思うのですがお力添えをお願いいたします』

Aベストアンサー

必ずしも文章でなくても、写真でもいいわけです。
写真が主で、説明のために文を添える。その程度なら、あまり意識的にネタを考えるということもせずに済むのではないでしょうか。
実際、写真とか絵とかが主であるブログもたくさんあります。
文章ばかりの日もあれば写真が主の日もある、という混合型のブログもあります。
写真といっても、特別なものである必要はないでしょう。
町のちょっとしたスナップでも、その街に行ったことのない者には、物珍しかったりするものです。それに説明を加える。
一度にたくさん載せるのではなく、一回に1枚だけでもOK。
数十枚あれば、それだけの回数のブログを書けるわけです。
写真、ときどき文章も。そんな感じでもいいんじゃないでしょうか。
もちろん、これは一例で、ヒントにすぎませんが、やるからには自分が楽しむつもりでやられたらいいと思います。


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング

おすすめ情報