浏览器缩放未对齐的解决方法

时间:2011-02-14 03:56:05

标签: javascript html css browser

我有一个网站,当用户放大时,线条在某些情况下不再完全排列。不幸的是,我没有一个展示的例子,但我知道这与我对缩放如何工作缺乏了解有关。我认为这与缩放时的事情有关,像素可能最终变成两个像素,因为一个旧像素被绘制在两个新像素的一半上,这取决于缩放如何影响像素方向。

是否有任何变通方法可以处理非常精确指定的网站缩放,所以即使像素关闭也很明显?

2 个答案:

答案 0 :(得分:1)

有两种缩放方式。一个只增加字体而另一个平均放大。如果您的问题是第二个,那么您可以做些什么就非常值得怀疑。如果它是第一种类型,那么看看你的字体如何扩展,并查找你可能想要从相对单位如ems更改为px的情况(在px中指定的一般字体不要缩放)。

答案 1 :(得分:1)

有许多浏览器功能,除了缩放之外,设计可以“按像素关闭”:

不同的可用字体,不同的字体渲染引擎,不同的舍入方法,不同的默认样式,浏览器错误,所以这不是单独缩放的问题。

很难给出具体的建议,但恕我直言最好是“与媒体合作”。

这开始于让原始设计不是基于像素,或者好像它是一种“固定”介质,如纸张 - 换句话说,它首先向客户/老板/设计师解释可能性,但也网页设计的限制。

对于实际实现,您需要拥抱HTML / CSS的“自然流程”。尽可能避免使用明确的尺寸规格。最重要的是避免固定高度和绝对定位。最好使用表(最好使用display: table-*,除非你必须支持IE6),而不是使用绝对定位。

如果您在网站上发布了一个网址,或者至少是一个示例网页,那么最好是因为我确定您的问题与缩放以及设计不灵活的所有内容无关。