V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
• 请不要在回答技术问题时复制粘贴 AI 生成的内容
sorakylin
V2EX  ›  程序员

微信这什么玩意?浏览器显示差异问题,求解

  •  
  •   sorakylin · 2022-08-15 10:24:51 +08:00 · 2691 次点击
    这是一个创建于 866 天前的主题,其中的信息可能已经有所发展或是发生改变。

    微信打开一个项目的详情页的话,图片就会被拉伸(拉伸到手机宽度),很迷,没太懂微信这内置的浏览器是个什么机制。

    正常从手机浏览器打开是没问题的。

    我做的,有的时候是得从微信分享,所以还是想解决这个问题。

    各位老哥麻烦看看,网站是: https://xquan.net


    手机端自适应的给 image box 设置了

    • height: 54.5vw;
    • max-width:100%

    没设置 width ,就只想固定个高度,让宽度自适应。

    其他的自适应倒也没发现有什么问题,就这个详情页的画廊图片宽度给我整懵了。


    主要是我也不好调试…… 难道得下个小程序开发工具打开网页去调试?也不知道行不行。


    对比:

    这是同一个项目。看画廊部分,图片展示问题

    t1

    6 条回复    2022-08-15 14:02:46 +08:00
    dfkjgklfdjg
        1
    dfkjgklfdjg  
       2022-08-15 10:36:43 +08:00
    考虑加一个 `width:auto` 试试看?微信内置的浏览器确实问题比较大,需要单独做一些适配的。
    如果能下微信开发者工具调试肯定是最好的。
    sorakylin
        2
    sorakylin  
    OP
       2022-08-15 10:41:54 +08:00
    @dfkjgklfdjg 了解了,看来还是得整个开发者工具😂
    okakuyang
        3
    okakuyang  
       2022-08-15 10:52:40 +08:00
    搜索“微信 x5 调试”因为安卓上微信内的 webview 用的是 x5 ,是腾讯修改 webkit 的一个版本。表现上会与 chrome 系列 webview 有差异。
    maotao456
        4
    maotao456  
       2022-08-15 11:07:19 +08:00
    @dfkjgklfdjg 微信开发者工具似乎是没用的, 我曾经一个 css 兼容问题只有真机才会出现。
    dfkjgklfdjg
        5
    dfkjgklfdjg  
       2022-08-15 13:07:27 +08:00
    @maotao456 #4 ,嗯,确实,但是总比没办法调试来得好一些,虽然很多兼容问题都只能靠经验推测出来。
    xiqishow
        6
    xiqishow  
       2022-08-15 14:02:46 +08:00
    @maotao456 #4 确实 开发工具走的是一个内核 就能预览个大概 还是要在设备上看实际效果 比如 flex 的 gap 属性 在工具预览没问题 iOS13 由于自身浏览器核心的问题 就是不支持
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   935 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 22:21 · PVG 06:21 · LAX 14:21 · JFK 17:21
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.