Html 如何为移动设备拆分/缩小表格

我正在尝试使此网站上的表在移动设备上正常运行：

页面上有两个表格；规格表和船选项定价表。我希望规格表在中间分割并包装，这样所有粗体字都在屏幕左边，数据在右边。

我还希望定价表变得更窄，这样就不会超出页面的侧面。我试着给每一列指定一个百分比宽度，但我似乎无法从中得到任何结果

---

我不擅长处理HTML表，所以我在这里有点迷茫。我怎样才能让他们合作？

首先，我们不能在这里教你HTML。你需要自己去学习

第二，这一页面的设计过于复杂。您是否正在使用具有现成主题的内容管理系统？因为HTML和CSS对于这样一个简单的站点来说太重了。这将使改变更加困难，尤其是对于移动“优化”

对于specs表：只需使用一个包含八行的两列表，而不是一个四乘四的表

然而，如果你想在桌面浏览器中保持相同/相似的布局，那就要复杂一些

---

对于价格表：从样式表中删除硬编码的

style=“width:400px

和

width:100%

。（后者将影响所有表，但在所有表上使用

width:100%

并不是一个好主意）。这样，表格将根据内容和屏幕宽度自动重新调整大小。您只需在表格单元格中添加一些填充，这样值就不会相互挤压。

您的“规格”表格并不是真正表示表格数据，它在此处仅用于布局目的（光束和功率之间有什么关系？）。是的，表格主要是为了便于读取数据。每行表示两个不相关的值。