为什么我的网页图像在HTML中横向显示,但在全屏显示时正确?

为什么我的网页图像在HTML中横向显示,但在全屏显示时正确?,html,iphone,image,Html,Iphone,Image,如果您查看此页面,您将看到右侧的两幅图像是横向的: 但当你点击它们时,它们会正确地垂直显示在全屏视图中。我看不出我的HTML img代码中有任何可能导致这种情况的错误 谁能告诉我为什么会这样?顺便问一下,这些照片是用iphone5拍摄的。这些照片是从侧面拍摄的吗?例如,您是否尝试过从Photoshop编辑和“为web导出” 可能问题出在图像EXIF上(因为浏览器读取EXIF信息并在屏幕上旋转它,所以您只能正确地看到图像)。导出它很可能会从图像文件中删除该信息,并可能使其正确 这是iPhone如

如果您查看此页面,您将看到右侧的两幅图像是横向的:

但当你点击它们时,它们会正确地垂直显示在全屏视图中。我看不出我的HTML img代码中有任何可能导致这种情况的错误


谁能告诉我为什么会这样?顺便问一下,这些照片是用iphone5拍摄的。

这些照片是从侧面拍摄的吗?例如,您是否尝试过从Photoshop编辑和“为web导出”


可能问题出在图像EXIF上(因为浏览器读取EXIF信息并在屏幕上旋转它,所以您只能正确地看到图像)。导出它很可能会从图像文件中删除该信息,并可能使其正确

这是iPhone如何导出图像的一个特殊问题。这似乎适用于类似的情况

计算机/浏览器和iPhone软件对相机元数据(图像细节,包括纵向/横向)的解释不同,从而导致渲染的差异


我能够在Pixelmator/Photoshop中下载最右边的图像,并再次将其保存为jpg,确保它是纵向的。这使得浏览器正确地渲染了图像,并且没有将其旋转90度。

我花了一个小时来处理它,我再也回不来了。:)

问题

我在三星GALAXY Tab PRO 8.4上拍摄了这张照片。它在Android仿真器和FireFox 42.0中横向呈现

修复程序

我在IrfanView中编辑了这张图片

我去了属性设置->JPG\U PCD\U GIF-> 取消选中“根据EXIF信息自动旋转图像(如果可用)”


它现在在FireFox中呈现OK。我还没有检查模拟器。

不要渲染海量图像并将其缩小:(这真的很慢…尼克-我的计划是通过图像处理器运行它们,以便在上传时缩小它们…但我想首先解决这个问题。这个网站还没有向公众直播。好的,第二和第三张图像是横向的,第一张是纵向的。原始图像也会横向显示。碰巧,我发现你也可以必须在预览中打开图像(如果您在Mac上),然后单击保存。。。