jquery - 需要帮助构建页面

Question

我失败的尝试是在 http://jsfiddle.net/NZtc4/

我正在尝试制作一个显示以下页面的网页应用程序页面，无论屏幕大小如何。

[Toolbar]
[ Image ]
[img][img][img]<-- 该行应该是可滚动的<->（可拖动）

• 工具栏是jquery mobile 的。
• 图像应为剩余高度的 67% 和 100% 宽度。
• imgs 应该是页面宽度的 50%，并且是剩余的高度。（在任何给定时间显示两个等效的完整图像。）
• 任意数量的imgs > 2。
  （所有图像都是锚点，但这超出了问题的范围。）

页面应该是无缝的；即元素之间没有间隙。

答案是所描述页面实现的演示或解释。

Answer 1

如果您的元素是inline-block. 为了消除这个差距，您需要添加font-size:0. 作为副作用，这需要您为实际包含文本的元素提供字体大小。（否则他们不会显示任何文本）。在 CSS3 中，您可以使用font-size:1rem将字体大小设置为主体（根）之一。

对于底部滚动条，您不需要指定width，而是需要white-space:nowrap让您的元素出现在同一行。

见编辑的例子：http: //jsfiddle.net/NZtc4/2/