问题描述
我知道浏览器禁用了自动旋转 JPG 文件.
I know that the automatic rotation of JPG files is disabled in browsers.
他们无法启用它，因为它会破坏某些网站的布局.
They can not enable it because it would break the layout of some websites.
有 CSS 属性吗?或 javascript 代码来实现?或者是其他东西?或者这个问题的解决方案尚不存在?
Is there a CSS property?or javascript code to achieve that?or something else?or maybe the solution to this problem doesn't exist yet?
推荐答案
CSS image-orientation: from-image
来自规范 https://www.w3.org/TR/css4-images/#the-image-orientation
6.2.在页面上定位图像:图像方向"属性
图像方向:来自图像
from-image:如果图像在其元数据中指定了方向，例如 EXIF，则该值计算为元数据指定的正确方向图像所需的角度.如有必要，该角度然后被圆整和归一化，如上所述作为一个值.如果其元数据中未指定方向，则该值计算为0deg".
from-image: If the image has an orientation specified in its metadata, such as EXIF, this value computes to the angle that the metadata specifies is necessary to correctly orient the image. If necessary, this angle is then rounded and normalized as described above for an value. If there is no orientation specified in its metadata, this value computes to ‘0deg’.
匹配 Chrome 问题:https://bugs.chromium.org/p/chromium/issues/detail?id=158753
Matching Chrome-Issue: https://bugs.chromium.org/p/chromium/issues/detail?id=158753
但是浏览器支持还不在这里:https://developer.mozilla.org/en/docs/Web/CSS/image-orientation#Browser_compatibility
But the browser support is not here yet: https://developer.mozilla.org/en/docs/Web/CSS/image-orientation#Browser_compatibility
有一个 JS 代码段可以做到这一点:https://gist.github.com/runeb/c11f864cd7ead969a5f0
There is a JS snippet to do this: https://gist.github.com/runeb/c11f864cd7ead969a5f0
我认为使用像 imagemagick 这样的工具在服务器上旋转图像的开销太大.
I think rotating the image on the server with tools like imagemagick is too much overhead.
浏览器可以旋转图像，但网络应用程序需要给出如何显式旋转的建议.
The browser can rotate the image, but the web application needs to give the advice how to rotate this explicitly.
浏览器轮换中的这个显式可以这样完成:https://stackoverflow.com/a/11832483/633961
This explicit in browser rotation could be done like this: https://stackoverflow.com/a/11832483/633961
这篇关于有没有办法告诉浏览器尊重 jpeg exif 方向?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！