当前位置: 首页 > 知识库问答 >
问题:

响应映像集的行为不符合预期

弓宏茂
2023-03-14

我正试图实现一个全屏幕响应的图像解决方案,具有以下松散的要求

0-600像素

经过一点挖掘,我决定使用尺寸:
iPhone 6

我为每个屏幕大小创建了单独的图像(用于艺术方向),并使用了以下srcset代码

<img    src="/assets/images/414X736/artGallery.jpg"
        srcset="/assets/images/414X736/artGallery.jpg 414w, 
                /assets/images/768x1024/artGallery.jpg 768w,
                /assets/images/1920x1080/artGallery.jpg 1920w">

图像具有以下CSS(因此它的行为类似于背景:封面)

img {
    display:block;
    height:100vh;
    width:100vw;
    object-fit:cover; 
}

我把我的桌面显示器的尺寸调整得很小,并调整到全屏,图像被替换到正确的位置

然而,在我的手机和平板电脑上,它始终显示1920年的图像

理想情况下,我希望在从小到大、从大到小缩放浏览器窗口时替换图像

我对srcset的理解是,一旦加载了最大的图像,它就不会加载较小的图像

感谢帮助和建议

共有1个答案

罗鸿畴
2023-03-14

如果你想做一些艺术指导,你需要使用

顺便说一下,您的代码遗漏了一个size属性,如果将srcset属性与w描述符一起使用,则该属性是必需的。

 类似资料:
  • 在实用服务中,我有两个功能foo和bar。js 在我的测试文件中,我导入了实用ervice.js并窥探了条形图函数。我期望调用间谍计数为1,因为foo被称为,但它是0。如果我错过了什么,请建议。

  • 使用4.0.31,我的AppHost配置方法是这样声明的: 我的印象是,这将把swagger用户界面的url设置为.../api/Resources的https版本,但是我仍然在swagger URL文本框中获得常规的超文本传输协议endpoint,例如: 我们的web服务器位于执行SSL卸载(并需要SSL)的负载平衡器之后,因此URL应为: 一个积极的方面是,使用“UseHttpsLinks”实

  • 我编写了一个方法,该方法应该在utf-8中以字符串类型返回有效的正文,但在发出请求后,我在UTF-16中得到响应。postman中的内容类型头是application/json。我在stackoverflow中搜索任何可能的解决方法,但任何解决方案都无济于事,包括这个主题(.我如何更改它以获得有效的主体?Thanx!

  • 我有一个选择一个图像的意图(我在一个片段中这样称呼它): 在我的活动中: 输出:OnActivityResult:请求代码:66084 OnActivityResult:Result:-1成功=true 正如您所看到的,结果是成功的,但请求代码发生了更改。所以我无法查证是什么请求。

  • 我正在仪表板上工作,用于监控作业,状态被更新,但是Ui网格中的在这里没有按预期运行,我尝试了什么 并且该函数应该使用fontgreat图标更新状态 但安格拉尔并没有像我所期望的那样,而是把这当作一段文字 这里是一个笨蛋 http://plnkr.co/edit/7UapXgNzZWPXVZbLjYFy?p=preview 如果你能帮我解释清楚,我们将不胜感激