如何在我的网页中垂直排列水平排列的部分,以使我的页面在设备上响应

How can I arrange horizontally arranged sections, in my web page, as vertically so as to make my page responsive on devices

我的问题:

我的网页屏幕分辨率比手机屏幕分辨率宽。我正在本地尝试从要在 WebView 上显示的资产。

  1. 这些部分在网格显示中水平排列。
  2. 然后当我在 phone 上看到相同的页面时,中间部分是 已折叠(未显示)。
  3. 水平和垂直滚动视图在应该显示的时候不可见。
  4. 并且应该是这样的:水平排列的部分应该 垂直排列以显示每个部分。

我试着把Horizo​​ntalScrollView和VerticalScrollView以及WebView放在里面。

我已将 WebView 的分辨率固定为 1000dp * 600dp(在我的布局 xml 中分别为 layout_width 和 layout_height)。

现在我可以滚动到屏幕的所有部分,但是点击和拖放在页面上不起作用(拖放是从 JavaScript 里面管理的)。

我试过使用onInterceptTouchEvent来拦截一些事件,但是我会说不建议使用。

我想完全从网页管理滚动和点击,而不是使用水平滚动视图和滚动视图并在 WebView 上设置高度和宽度。

正在尝试寻求帮助:

  1. How to make a page responsive
  2. How can I arrange horizontally ...

下面的link稍微解决了我的问题。我可以控制何时希望上面的滚动条在我需要时滚动(或者通过在这个滚动视图父级中添加一个填充尺寸来提供滚动区域)。

还有一个捷径:

但它提供的控制较少。如果你在这个滚动视图父级中添加一个填充维度来提供滚动区域,它就满足了我的需要。