【发布时间】:2018-07-01 19:43:05
【问题描述】:
对于我正在构建的网页内容,我将宽度设置为700px。奇怪的是,在我的 Firefox 浏览器(Ubuntu 16)上,它在我的屏幕上显示为 700px。在我的 Chrome 浏览器(版本 63)上,内容扩展至 1125 像素。我真的不希望我的应用程序在不同的浏览器上给出如此不同的结果。
这是一部电影的代码:
<video preload muted autoplay loop
style = "width:700px;">
<source src="http://www.w3schools.com/html/mov_bbb.mp4"
type="video/mp4">
</video>
如果有人想复制它,请在这里提琴:https://jsfiddle.net/kae4q601/232/
图片的相似代码:
<h1> Hi I'm text how are you </h1>
<img src="http://lifecdn.dailyburn.com/life/wp-content/uploads/2015/03/The-Nut-That-Could-Help-You-Live-Longer_2.jpg" style="width:700px; height:auto;">
再次,在我的末端重现它的小提琴: https://jsfiddle.net/cortical_iv/kae4q601/233/
当我进入开发者工具并检查元素时,它显示图像在每个浏览器中的宽度都是正确的 (700 像素)。因此,浏览器都清楚地认为它们显示了正确的尺寸。
网上有人建议进入 Chrome 设置并将页面缩放设置为 100%,但我的已经有了这个设置。在两个浏览器中,我都点击了ctrl-0,以确保我没有意外放大视口。
我现在意识到 Chrome 上的文本甚至更大,所以我的计算机上的 Chrome 中似乎存在一般缩放问题。我的系统根本没有设置为可扩展的。
【问题讨论】:
-
-
不幸的是,这似乎并没有改变它。修改问题以显示我使用开发工具检查的更多内容。而且,您的评论让我意识到我的代码中不需要所有额外的绒毛,因此简化了代码/小提琴以获得更好的 SSCCE。
-
添加
height:auto有帮助吗? -
@AliSheikhpour:没有变化。
-
听起来 Chrome 只是自动将所有内容缩放 1.25 左右。我找到了一些适用于 Windows 的修复程序,但我在 Ubuntu 上。坦率地说,如果有人在高清设备上,如果我的网站是他们习惯的规模,那也不会那么糟糕。我想我只需要开发多个规模?如果我在我的机器上“修复”它,那并不意味着它对其他人来说是固定的,所以我需要使用它并将其视为自然浏览器变体。在这里讨论:howtogeek.com/278699/…
标签: css google-chrome