图片在移动视图中显示为方形

支持
1

我注意到许多上传的图片在移动端视图中被压缩成了“正方形”图像。
请问这是预期的设计，还是某个设置导致的结果？
非常感谢！

移动端视图：

image
image391×307 56.2 KB

同一张图片在 PC 端视图：
image
image925×460 145 KB

2

上传图片以确认

image
image508×290 16.6 KB

这张图片是从运行 iOS 14 的 iPhone 手机上传的，上传后显示正常。也许图片在您手机上上传前被压缩了？对我来说一切正常。

您使用的是哪个浏览器及版本？您的手机操作系统及版本是什么？

3

请注意，两次显示的都是同一张图片，只是在移动设备上查看？看起来宽高比或高度计算出现了问题。

4

感谢回复。

我认为图片没有被压缩，因为我直接上传了截图。

我在电脑上使用的浏览器是 Chrome。
手机上使用的是 Android 10。

这是我发布的有问题的图片链接：

也许您可以检查一下，看是否会在上述链接的图片中遇到同样的问题？

5

是的，这是同一张图片，但在电脑和手机上显示效果不同。

6

这是因为来自自定义主题/组件的 CSS 规则：

// 主题：表情大小
// 目标：移动端 scss
// 最后编辑：2016-02-10 14:39:25 UTC

div.contents.regular > div > p > img {
    height: 100px;
    width: 100px;
}
div.d-editor-container > div.d-editor-preview-wrapper > div > p > img {
    height: 100px;
    width: 100px;
}
7

非常感谢你找到了根本原因！不过，我仍然不太清楚在哪里能找到这条规则。你知道如何编辑或修改它吗？

8

在您的管理面板中，进入“自定义” > “主题”。选择正确的主题或组件，点击“编辑 CSS/HTML”，然后检查 CSS 选项卡，通常位于移动端的顶部选项卡中。您应该能在某处找到对应的 CSS 代码，您可以选择将其注释掉或删除：

（此处已注释）

// 主题：表情大小
// 目标：mobile scss
// 最后编辑时间：2016-02-10 14:39:25 UTC
/*
div.contents.regular > div > p > img{
    height:100px;
    width:100px;
}
div.d-editor-container > div.d-editor-preview-wrapper > div > p > img{
    height:100px;
    width:100px;
}*/
9

是的，移除它已经解决了问题。非常感谢！