如何使响应式html表与视口初始比例1.0匹配

Question

在我的网站上，我有一些页面包含页眉页脚和表格， 我正在使用视口。

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Html表包含很多列，因此在移动设备中它会溢出到屏幕上。

要查看整个html表格访问者必须缩小网页。

如图所示：

缩小后，您可以在图片标题中看到并且div不会扩展以匹配html表格宽度。

缩小后它的宽度仍然很短，因为我正在使用元视口，初始比例是1.0

但我需要这样的结果

参考图片：

当在移动设备的浏览器中打开网页时，我需要帮助。

html表应缩小[缩小]到设备宽度，所有其他元素的宽度应保持相同或等于设备宽度。

我在网上搜索，我发现了这个：enter link description here 4.响应表

Answer 1

您可以使用Bootstrap来涵盖这些场景。另外，Css，图像设置为100％with和height，或css技巧来实现这一点。 @Media查询可以帮助您动态加载或更改图像，以适应不同的设备分辨率。

除此之外，我不确定您指定的问题是否与需要缩小为默认视图的默认视图有关。