我的失败尝试位于 http://jsfiddle.net/NZtc4/
我正在尝试制作一个显示以下页面的网络应用程序页面,无论屏幕大小如何。
[工具栏]
[图片]
[img][img][img]
<-- 该行应该是可滚动的 <-> (可拖动的)
- 工具栏是 jquery 移动工具栏。
- 图片应为剩余高度的 67% 和宽度的 100%。
- img 应占页面宽度的 50%,并为剩余高度。 (在任何给定时间显示两张等效的完整图像。)
- 任意数量的 img >2。
(所有图片都会是anchors,但这超出了问题的范围。)
页面应该是无缝的;即元素之间没有间隙。
答案是描述页面实现的演示或解释。
最佳答案
如果您的元素是 inline-block
,则 HTML 中的换行符将被解释为空格。为了消除这个差距,您需要添加 font-size:0
。作为副作用,这要求您为实际包含文本的元素提供字体大小。 (否则他们不会显示任何文字)。在 CSS3 中,您可以使用 font-size:1rem
将字体大小设置为主体(根)之一。
对于底部滚动条,您不需要指定 width
,而是需要 white-space:nowrap
以便您的元素出现在同一行。
查看编辑示例:http://jsfiddle.net/NZtc4/2/
关于jquery - 需要帮助构建页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10656609/