5

ページの中央で、2 つの表を 1 行に並べるにはどうすればよいですか? 私が見たい結果：

                                11 12   11 12
                                21 22   21 22

私が得る結果：

11 12
21 22
11 12
21 22

<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>11</td>
    <td>12</td>
  </tr>
  <tr>
    <td>21</td>
    <td>22</td>
  </tr>
</table>
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>11</td>
    <td>12</td>
  </tr>
  <tr>
    <td>21</td>
    <td>22</td>
  </tr>
</table>
4

3 に答える 3

3

これを使用し、要件に従って幅を調整してください。ドキュメントの中央に配置する場合は、divを取得してページの中央に配置し、次のhtmlを配置します。

<table border="0" cellpadding="0" cellspacing="0" style="width:50%;float:left">
<tbody>
<tr>
  <td> 11</td>
  <td> 12</td>
</tr>
<tr>
  <td> 21</td>
  <td> 22</td>
</tr>
</tbody>
</table>
<table border="0" cellpadding="0" cellspacing="0" style="width:50%;float:left">
<tbody>
 <tr>
  <td> 11</td>
  <td> 12</td>
</tr>
<tr>
  <td> 21</td>
  <td> 22</td>
</tr>
</tbody>
</table>
于 2013-01-11T12:44:11.673 に答える
1

別のテーブルを作成し、これら 2 つのテーブルをその中に埋め込むことができます。

<table border="0" cellspacing="0" cellpadding="0">
 <tr>
 <td>
    <table border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td>11</td>
            <td>12</td>
          </tr>
          <tr>
            <td>21</td>
            <td>22</td>
          </tr>
    </table>    
 </td>
 <td>
    <table border="0" cellspacing="0" cellpadding="0">
       <tr>
            <td>11</td>
            <td>12</td>
       </tr>
       <tr>
            <td>21</td>
            <td>22</td>
       </tr>
     </table>
 </td>
 </tr>
</table>

または、 css で float プロパティを使用できます。

于 2013-01-11T12:39:24.560 に答える
-1

このhttp://jsfiddle.net/pNH3T/は、考えられる解決策の 1 つです。

<div style="display:block; width:100%">
  <div style="margin:0 auto; width:200px;">
    <table border="0" cellspacing="0" cellpadding="0" style="float:left; margin-right:10px;">
      <tr>
        <td>11</td>
        <td>12</td>
      </tr>
      <tr>
        <td>21</td>
        <td>22</td>
      </tr>
    </table>
    <table border="0" cellspacing="0" cellpadding="0" style="float:left">
      <tr>
        <td>11</td>
        <td>12</td>
      </tr>
      <tr>
        <td>21</td>
        <td>22</td>
      </tr>
    </table>
  </div>
</div>
于 2013-01-11T12:30:58.850 に答える