blocks|key|3081356|text|使用CSS：table+{float:left;}​？|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|3081357|entityMap^0|6|K|0^^$0|@$1|2|3|4|5|6|7|H|8|@$9|I|A|J|B|C]]|D|@]|E|$]]|$1|F|3|-4|5|6|7|K|8|@]|D|@]|E|$]]]|G|$]]

<p>With CSS: <code>table {float:left;}​</code> ?</p>


blocks|key|3081386|text|您可以将表放在div中，并将样式添加到表"float:+left“|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3081387|<div>
++<table+style="float:+left">
++++<tr>
++++++<td>..</td>
++++</tr>
++</table>
++<table+style="float:+left">
++++<tr>
++++++<td>..</td>
++++</tr>
++</table>
</div>|code-block|syntax|javascript|3081388|或者简单地使用css：|3081389|div>table+{
++float:+left
}|3081390|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|N|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|O|8|@]|9|@]|A|$]]|$1|I|3|J|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|K|3|-4|5|6|7|Q|8|@]|9|@]|A|$]]]|L|$]]

<p>You can place your tables in a div and add style to your table "float: left"</p>

<pre><code>&lt;div&gt;
  &lt;table style="float: left"&gt;
    &lt;tr&gt;
      &lt;td&gt;..&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  &lt;table style="float: left"&gt;
    &lt;tr&gt;
      &lt;td&gt;..&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
&lt;/div&gt;
</code></pre>

<p>or simply use css:</p>

<pre><code>div&gt;table {
  float: left
}
</code></pre>


blocks|key|221575|text|<div+style="float:+left;margin-right:10px">
++<table>
++++<tr>
++++++<td>..</td>
++++</tr>
++</table>
</div>
<div+style="float:+left">
++<table>
++++<tr>
++++++<td>..</td>
++++</tr>
++</table>
</div>|type|code-block|depth|inlineStyleRanges|entityRanges|data|syntax|javascript|221576|unstyled|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|G|8|@]|9|@]|A|$B|C]]|$1|D|3|-4|5|E|7|H|8|@]|9|@]|A|$]]]|F|$]]

<pre><code>&lt;div style="float: left;margin-right:10px"&gt;
  &lt;table&gt;
    &lt;tr&gt;
      &lt;td&gt;..&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
&lt;/div&gt;
&lt;div style="float: left"&gt;
  &lt;table&gt;
    &lt;tr&gt;
      &lt;td&gt;..&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
&lt;/div&gt;
</code></pre>


blocks|key|2867778|text|根据您的内容和空间，您可以使用浮动或内联显示：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|2867779|<table+style="display:+inline-block;">

<table+style="float:+left;">|code-block|syntax|javascript|2867780|点击这里查看：http://jsfiddle.net/SM769/|offset|length|2867781|文档|style|BOLD|2867782|MDN上的|2867783|CSS+display+-+MDN+-上的|unordered-list-item|CODE|2867784|+float|2867785|2867786|2867787|entityMap|0|LINK|mutability|MUTABLE|url|http://jsfiddle.net/SM769/^0|0|0|7|Q|0|0|0|2|0|0|4|7|1|1|5|1|0|0^^$0|@$1|2|3|4|5|6|7|16|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|17|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|18|8|@]|9|@$I|19|J|1A|1|1B]]|A|$]]|$1|K|3|L|5|6|7|1C|8|@$I|1D|J|1E|M|N]]|9|@]|A|$]]|$1|O|3|P|5|6|7|1F|8|@]|9|@]|A|$]]|$1|Q|3|R|5|S|7|1G|8|@$I|1H|J|1I|M|T]]|9|@]|A|$]]|$1|U|3|V|5|S|7|1J|8|@$I|1K|J|1L|M|T]]|9|@]|A|$]]|$1|W|3|-4|5|6|7|1M|8|@]|9|@]|A|$]]|$1|X|3|-4|5|6|7|1N|8|@]|9|@]|A|$]]|$1|Y|3|-4|5|6|7|1O|8|@]|9|@]|A|$]]]|Z|$10|$5|11|12|13|A|$14|15]]]]

<p>Depending on your content and space, you can use floats or inline display:</p>

<pre><code>&lt;table style="display: inline-block;"&gt;

&lt;table style="float: left;"&gt;
</code></pre>

<p>Check it out here: <a href="http://jsfiddle.net/SM769/">http://jsfiddle.net/SM769/</a></p>

<p><strong>Documentation</strong></p>

<ul>
<li>CSS <code>display</code> on MDN - <a href="https://developer.mozilla.org/en/CSS:display">https://developer.mozilla.org/en/CSS:display</a></li>
<li>CSS <code>float</code> on MDN - <a href="https://developer.mozilla.org/en/CSS/float">https://developer.mozilla.org/en/CSS/float</a></li>
</ul>


<blockquote>
  <p><strong>Possible Duplicate:</strong><br>
  <a href="https://stackoverflow.com/questions/8917235/trying-to-get-tables-next-to-each-other-horizontal">Trying to get tables next to each other horizontal</a>  </p>
</blockquote>



<p>I have two html tables already created. How can I place them side by side instead of 1 above the other?</p>


HTML -- two tables side by side

 可能重复：我已经创建了两个html表。我如何将它们并排放置，而不是一个放在另一个之上？

问HTML --两个并排的表
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML --两个并排的表EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML --两个并排的表
EN