使用 jquery mobile 自动调整内容页面大小

Question

我正在使用 jquery mobile 构建一个网络应用程序。彼此之间有 3 个 div，每个 div 中又有 2 个 div。第一个是宽度为 50% 和自动调整高度的图像。在第二个中，只有文本。我希望这 3 个 div 彼此填充整个内容页面并调整大小以适应不同的设备尺寸。 现在，内容不会改变大小，如果视图的高度变小，jquery 会将它们添加到滚动视图中。 这里有两张截图便于理解：

感谢您的帮助

Answer 1

尝试使用百分比来调整高度和宽度，而不是使用像素。此外，无论设备的屏幕大小如何，您都可以默认使用 auto 调整整个屏幕的大小。

Answer 2

试试下面的代码：

<div class="group>
  <div class="img"><img src="path-to-img"/></div>
  <div class="text"> Text 1 </div>
</div>
<div class="group>
  <div class="img"><img src="path-to-img"/></div>
  <div class="text"> Text 2 </div>
</div>
<div class="group>
  <div class="img"><img src="path-to-img"/></div>
  <div class="text"> Text 3 </div>
</div>

--- 样式表 ---

.group{ width: 100%; }
.img, .text{ width: 50%; }

希望这会有所帮助。