如何创建：响应式表格

学习如何创建响应式表格。

响应式表格

如果屏幕太小，无法显示全部内容，响应式表格将显示水平滚动条。

请调整浏览器窗口大小以查看效果:

First Name	Last Name	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points	Points
Jill	Smith	50	50	50	50	50	50	50	50	50	50	50	50	50	50	50	50	50	50	50
Eve	Jackson	94	94	94	94	94	94	94	94	94	94	94	94	94	94	94	94	94	94	94
Adam	Johnson	67	67	67	67	67	67	67	67	67	67	67	67	67	67	67	67	67	67	67

为了创建一个响应式表格，在 <table> 外围添加一个包含 overflow-x:auto 的容器元素：

<div style="overflow-x:auto;">
  <table>
    ...
  </table>
</div>

注意：在 OS X Lion（Mac 上）中，滚动条默认隐藏，仅在使用时显示（即使设置了 "overflow:scroll" 或 auto）。