响应表（纯html / css）

Question

Code：https://jsfiddle.net/qo44rgop/

如果屏幕变小，我希望表格将td移动到下一行（现在它将表格扩展到div的宽度之外）。我尝试在桌面上使用margin: auto，它将它集中在div上，但它不适应屏幕尺寸。

Answer 1

您可能要考虑的一件事是将显示属性更改为＆＃39; block＆＃39;在一定的规模限制下。示例：

@media (max-width: 600px){
  td{
    display:block
  }
}

Answer 2

我认为您应该使用@media并在屏幕宽度符合您的小概念时将表格单元格的宽度设置为100％（或更改display属性）（我认为768px是移动设备的正常max-width，现在不记得了。）

您在我给​​出的链接中有一个示例，位于底部。