时间戳

首页 > 解决方案 > 元素在 Safari 网络浏览器上响应不佳

html - 元素在 Safari 网络浏览器上响应不佳

问题描述

我使用一个<picture>元素使图像根据屏幕尺寸做出响应。它适用于除Safari之外的大多数网络浏览器。使用Safari网络浏览器，我每次都必须刷新页面才能看到预期的结果。

为了解决这个问题，我从以下站点添加了polyfill并按照说明操作： http ://scottjehl.github.io/picturefill/但它没有解决问题。

任何有关此问题的帮助将不胜感激！

<picture>这是元素的标记：

<picture>
  <source media="(min-width: 600px)" srcset="images/image-lrg.jpg" />
  <img src="images/image-smll.jpg" alt="image of laptop" />
</picture>

标签： html

解决方案

<picture>
   <source media="(min-width: 600px)" srcset="https://www.w3schools.com/css/img_lights.jpg" />
   <img src="https://www.w3schools.com/css/img_5terre.jpg" alt="Cinque Terre" />
</picture>

阅读 URL： https ://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL

阅读浏览器兼容性 - <picture>： https ://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture#browser_compatibility

推荐阅读