html - Bootstrap 图像圈在 iOS 上旋转

Question

我遇到了旋转图像的问题。问题出现在 iPhone 上的 Safari 浏览器中。

您看到(严重)红色圆圈图像。在 iPhone 上，它无缘无故地旋转了 90 度。使用完全相同的 HTML 和 CSS，上图在两个浏览器上都能正确显示。

我正在使用 bootstrap css 框架，这就是图像的显示方式:

<div class="col-lg-12" style="text-align: center; margin: 20px; background-color: rgba(255, 255, 255, 0); padding: 30px; border-radius: 20px;">
<div class="col-md-3">
    <img class="img-circle" src="../admin/uploads/categories/<?php echo $categoryRow["img"]; ?>" width="140px" height="140px">
</div>
<div class="col-md-9">
    <h2><?php echo $categoryRow['name']; ?></h2>
    <p><?php echo $categoryRow['description']; ?></p>
    <p><a class="btn btn-default" href="category.php?id=<?php echo $categoryRow['catID']; ?>" role="button">Mehr <?php echo $categoryRow['name']; ?></a></p>
</div>

在此页面上，不同文章的类别将显示为带有图像(带有问题)以及标题和描述。这发生在由 PHP 完成的 while() 中。

问题是我想知道为什么图像在 iPhone 上旋转，这不应该。该网站在 Android 浏览器和台式电脑上运行完美。就在 iOS 和 Safari 上，这个神秘的东西出现了。我真的希望你能帮我解决这个问题。

周日快乐，感谢你的期待:)

Answer 1

这不是 bootstrap image-circle 的问题。这是图像的exif数据的问题。请看How to prevent auto-rotating images on iOS on HTML with CSS/Javascript