在Android的浏览器中保持屏幕上的文字
问题描述:
我正在尝试修改Dokuwiki模板以供个人使用。我遇到的一个问题是,当我在Android的默认浏览器中访问它并放大文本时,某些工具链接将不在屏幕上 - 我必须重复滑动才能看到它们。尽管事实上文本的其余部分在其增加的尺寸中进行了细化,并且它不使用绝对定位(它使用固定位置,但仅在垂直方向,而我的演示根本没有)。在Android的浏览器中保持屏幕上的文字
在Chromium(和Firefox)中,调整窗口或文本的大小并不会将文本从视图中移出。
我已经放在一起演示问题的最小示例。这里的XHTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="en"
lang="en"
dir="ltr">
<head>
<title>test</title>
<link rel="stylesheet" href="./css_1.css" />
</head>
<body>
<h1>Heading</h1>
<div id="tools">
<ul>
<li>Menu Item</li>
</ul>
</div>
<p>
It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.
</p>
</body>
</html>
...和CSS:
#tools {
float:right;
text-align:right;
margin-bottom:2.1em;
}
文本的段落调整大小和正常卷绕时Menu Item
文本缩放后最终关闭屏幕。
答
当您放大Chrome或Firefox时,将增加文本大小而不依赖于缩放图像。浏览器尝试按原样在窗口中呈现调整后的内容,仅在需要时添加滚动条。在Android中最接近的类比称为“文本大小”,并且可以通过浏览器应用程序的“设置”选项菜单项进行配置。
当您放大标准的Android浏览器时,这更像是一种“放大镜”效果,可以统一增加所有内容的可见尺寸,并且您需要通过手势平移才能找到所有内容。该页面并没有真正改变,就像通过放大镜看一张纸不会改变纸张或其上写的内容一样。
(除非你训练通过放大镜纸太阳的光芒 - 这样的证明作为练习留给读者)
可以想象的是,有一些被解雇了一些JavaScript事件在Android浏览器中放大,但我不希望有通过CSS缩放的方式,尽管您应该能够通过CSS对文本大小的变化做出反应。
如果这是真的,为什么文本的其余部分会重排?我不需要平移阅读主要文本 - 它被包裹在不同的点,所以我只需要垂直滚动。 – detly 2011-04-10 11:39:18
@detly:我无法在任何我尝试的网页上重现您的行为。如果您有链接可以证明您的效果,请发布。 – CommonsWare 2011-04-10 12:35:13
这里是我的演示:http://heeris.id.au/test/start.xhtml ...请注意,当你在股票Android浏览器上缩放缩放时,主文本会重新包装,但菜单项会相应地进一步缩小。 – detly 2011-04-10 12:47:47