从三星 phone 获取的图片在 html 来源时方向错误
Image taken from Samsung phone orients wrong when sourced in html
因此，对于我的 webdev class 的介绍性作业，我们的教授希望我们为我们的服务器制作一个 index.html 页面，以显示我们的个人资料。该个人资料应包含一张照片。
我在我的 phone 上拍了一张照片并上传到我们的服务器，当我打开我的页面时我很生气，我的脸旋转了 90 度。所以我在样式中添加了一个转换标签：
<img src="assets/pictures/selfie.jpg" alt="Selfie" style="width: 304px; height: 228px; transform: rotate(90)">
当我把这个给我的教授看时，他告诉我不要使用转换标签 "avoid the client's browser having to rotate it. Just rotate it yourself in the first place"。
我在我的桌面编辑器中尝试了这个，然后重新上传了照片并取消了转换。相同方向问题，旋转 90 度。
<img src="assets/pictures/selfie.jpg" alt="Selfie of Ryan White" style="width: 304px; height: 228px;">
这里发生了什么？我该如何解决这个方向问题？
如果您通过 Windows' 工具（右键单击菜单、Windows' 照片等）旋转图像，则只有 windows 可以看到。如果你真的想旋转图像，你需要使用类似 Paint 或 GIMP 的工具来旋转它，然后以这种方式保存它。无论从哪里看，这都会给你正确的旋转。
是的，这是大多数移动 phone 图片中的普遍趋势。我可以推荐软件来实现你想要的。
- Photoshop
- Corel 绘图
- 绘画
- 简单的图像查看器
最重要的是当你实现转换后记得在你的网页上使用图像之前保存。
因此，对于我的 webdev class 的介绍性作业，我们的教授希望我们为我们的服务器制作一个 index.html 页面，以显示我们的个人资料。该个人资料应包含一张照片。
我在我的 phone 上拍了一张照片并上传到我们的服务器，当我打开我的页面时我很生气，我的脸旋转了 90 度。所以我在样式中添加了一个转换标签：
<img src="assets/pictures/selfie.jpg" alt="Selfie" style="width: 304px; height: 228px; transform: rotate(90)">
当我把这个给我的教授看时，他告诉我不要使用转换标签 "avoid the client's browser having to rotate it. Just rotate it yourself in the first place"。
我在我的桌面编辑器中尝试了这个，然后重新上传了照片并取消了转换。相同方向问题，旋转 90 度。
<img src="assets/pictures/selfie.jpg" alt="Selfie of Ryan White" style="width: 304px; height: 228px;">
这里发生了什么？我该如何解决这个方向问题？
如果您通过 Windows' 工具（右键单击菜单、Windows' 照片等）旋转图像，则只有 windows 可以看到。如果你真的想旋转图像，你需要使用类似 Paint 或 GIMP 的工具来旋转它，然后以这种方式保存它。无论从哪里看，这都会给你正确的旋转。
是的，这是大多数移动 phone 图片中的普遍趋势。我可以推荐软件来实现你想要的。
- Photoshop
- Corel 绘图
- 绘画
- 简单的图像查看器
最重要的是当你实现转换后记得在你的网页上使用图像之前保存。