gpt4 book ai didi

css - 固定双标题,可滚动内容(移动应用程序)

转载 作者:行者123 更新时间:2023-11-28 13:33:21 25 4
gpt4 key购买 nike

我在使用 WebWorks 设计移动应用程序布局时遇到问题。页面的布局是:

----------------Title Header (div#title)-----------------
----------------Tabs Header(div#tabs)--------------------
----------- content (div#content) ----------------

标记:

<body>
<div id="mainContainer">
<div id="title">Some title</div>
<div id="tabs">Some navigation tabs</div>
<div id="content>
<!--- some contents that could be in contain in div or table populated from
database-->
</div>
</div>

div#title 和 div#tabs 是固定标题。 div#content 可以垂直滚动而不会重叠 div#title 和 div#tabs,也可以水平滚动,但 div#title 和 div#tabs 在水平滚动时不能移动或消失。

我曾尝试将 positon: fixed 设置为 div#title 和 div#tabs,但是当尝试在 BlackBerry 手机中滚动时,会出现一些滞后问题,即 div#title 和 div#tabs 需要很长时间才能刷新和显示自身。

如果 position: fixed 不能使用,有没有人可以固定标题但使内容可滚动而不重叠或拉伸(stretch)布局?

谢谢。

最佳答案

我总是这样处理滚动:


body {
位置:固定;
}

#title, #tabs {
位置:固定;
}

#content {
溢出-y:滚动;
-webkit-溢出滚动:触摸;//对于 bb10
}

请注意,如果您的目标是 BlackBerry 10,-webkit-overflow-scrolling: touch; 将允许您使用惯性滚动效果。

关于css - 固定双标题,可滚动内容(移动应用程序),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13301164/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com