Foundation 表格

Foundation 的 <code>&lt;table&gt;</code> 元素样式为灰色斑马条纹且包含四个边框：

&lt;table&gt;

  &lt;thead&gt;

    &lt;tr&gt;

&lt;th&gt;Firstname&lt;/th&gt;

      &lt;th&gt;Lastname&lt;/th&gt;

&lt;th&gt;Email&lt;/th&gt;

    &lt;/tr&gt;

  &lt;/thead&gt;

  &lt;tbody&gt;

&lt;tr&gt;

      &lt;td&gt;John&lt;/td&gt;

&lt;td&gt;Doe&lt;/td&gt;

      &lt;td&gt;[email protected]&lt;/td&gt;

&lt;/tr&gt;

&lt;td&gt;Mary&lt;/td&gt;

      &lt;td&gt;Moe&lt;/td&gt;

&lt;td&gt;[email protected]&lt;/td&gt;

      &lt;td&gt;July&lt;/td&gt;

&lt;td&gt;Dooley&lt;/td&gt;

      &lt;td&gt;[email protected]&lt;/td&gt;

  &lt;/tbody&gt;

&lt;/table&gt;

使用 CSS 让表格支持响应式设计：在表格外添加 <code>&lt;div&gt;</code> 元素，样式为 <code>overflow-x:hidden</code>:

&lt;div style="overflow-x:hidden"&gt;

  &lt;table&gt;

...

  &lt;/table&gt;

&lt;/div&gt;