开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

社区首页 >问答首页 >Safari不要求调整大小的srcset图像

问Safari不要求调整大小的srcset图像
EN

Stack Overflow用户

提问于 2017-08-14 01:17:18

回答 2查看 2.3K关注 0票数 6

我想提供响应图像，因为我使用srcset属性。

<img 
    src="https://res.cloudinary.com/demo/image/upload/w_480/group.jpg" 
    alt=""
    srcset="
        https://res.cloudinary.com/demo/image/upload/w_480/group.jpg 480w,
        https://res.cloudinary.com/demo/image/upload/w_750/group.jpg 750w,
        https://res.cloudinary.com/demo/image/upload/w_1334/group.jpg 1334w,
        https://res.cloudinary.com/demo/image/upload/w_1536/group.jpg 1536w,
        https://res.cloudinary.com/demo/image/upload/w_2048/group.jpg 2048w
    "
>

Chrome和android的工作原理如出一辙；在一部肖像机上，它将加载一个“小”图像，只需填充宽度，如果你打开手机，它就会根据新的宽度请求一个新的图像。

在Chrome检查工具中，选择iOS设备(iPhone 6，iPad)工作得很好：

但是Safari桌面和手机都不要求在调整大小/转动设备上出现新的图像。但它确实要求在重新加载时获得正确的图像。

我尝试了Safari9.1.2和11.0，iPhone 6 (iOS 10.3.2)，iPhone 6s (iOS 11.0)和iPad Air 2 (iOS 11.0)。

Safari是否仍然缺乏对srcset的支持？是应该被完全支持。

在码页测试自己。代码在代码也是。

responsive-images

EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-10-03 08:34:47

当前srcset的状态是这样的，我不完全确定您正在寻找的是一个需求。

Jason的这篇题为“2017年的响应图像状况”的文章帮助解释了，虽然其中的一些含糊不清是为了促进浏览器之间的竞争而设计的，但其中一些可能会得到更好的澄清：

...the不同的行为会导致混淆。我听到的最常见的问题是在Safari中测试srcset的人，而没有看到随着视口大小的变化而下载的新图像。没有任何东西表明浏览器需要下载新的图像，因为视口发生了变化。事实上，如果浏览器已经有了一个更大的版本，并且可以缩小它的大小，那么下载一个新的图像可能是没有意义的。因此，虽然这可能是一个特性，而不是一个bug，但我们可以为开发人员做一个更好的设置期望的工作。

在此期间，我将谨慎地引用对srcset的充分支持。根据我最近的经验，这绝对不是。

票数 0

EN

Stack Overflow用户

发布于 2018-04-14 14:16:43

它也不像Chrome那样使用1.1x或更高的srcset图像( 110%缩放等)。

简单地说:当我使用缩放时，图像在Safari中是不清晰的，在Chrome中是尖锐的。不想在那里讨论。Safari输了Chrome赢了。

票数 0

EN

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/45671200

复制

相关文章

Python 在 Wiki 标记中添加无

Python编程快速上手实践项目题目，欢迎指证与优化！代码： #! python3 # bulletPointAdder.py - Adds Wikipedia bullet points to the start # of each line of text on the clipboard. import pyperclip text = pyperclip.paste() # 从剪贴板粘贴文本 lines = text.split('\n') # 使用 split()方法得到一个字符串的列表，以回

py3study

2020/01/09

3K0

在 NLP 中训练 Unigram 标记器

nlp 继承模型数据语法

单个标记称为 unigram。Unigram 标记器是一种只需要一个单词来推断单词的词性标记器类型。它有一个单词的上下文。NLTK库为我们提供了UnigramTagger，并从NgramTagger继承而来。

很酷的站长

2023/08/11

3140

在 NLP 中训练 Unigram 标记器

快速在组合中查找重复和遗失的元素

? ? ? ? ? ? ? ?

望月从良

2018/09/29

4.4K0

快速在组合中查找重复和遗失的元素

在可编辑div中定位光标和设置光标

当我们去点击一个输入框的时候，就会产生一个选中对象 selection，就是我们可以看到的文字变成蓝色的那个区域，selection在火狐浏览器可以直接用 window.getSelection()获取，在HTML里面，selection只有一个的，并且selection是一个区域，你可以想象成一个长方形，它是有开始和结束的。

越陌度阡

2020/11/26

9.5K0

Android 百度地图SDK 自动定位、标记定位

android android studio sdk ide xml

如果是你满意的那样，我们就可以开始写了，首先创建一个名为MapDemo的项目。打开AndroidManifest.xml，复制你的包名

晨曦_LLW

2022/05/10

2.5K1

Android 百度地图SDK 自动定位、标记定位

Java--类和对象之组合和继承

上一篇：类和对象之初始化和清除类的组合的实现很简单，只需要在新类中置入对象句柄即可： class Door{ //字段和方法 } class Wheel{ //字段和方法 } public class Car{ Door d = new Door(); wheel w = new wheel(); //其他字段和方法 } 类的继承需要使用关键字extends. 创建一个类时肯定会使用继承，因为每个类都是继承自根类Object. class animal{

SuperHeroes

2018/05/22

1.1K0

对象的组合

java 编程算法安全容器

同步策略规定了如何将不变性条件、线程封闭和加锁机制结合起来以维护线程的安全性，并且规定了哪些变量由哪些锁来保护

JavaEdge

2022/11/29

4090

json文件处理对象标记

json 编程算法 python

JSON(JavaScript Object Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于 ECMAScript (w3c制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成，并有效地提升网络传输效率。Pycharm

用户2200417

2022/02/28

8320

HTML布局标记和列表标记

border table 表格布局

首先要介绍的布局标记是div标记，div可以做网页的层也可以做网页的分区。当div做网页的层时可以实现漂浮在网页上的效果，就像我们经常可以在网站里看见的那些漂浮广告。div做网页的分区时，则是可以布置网页的格局，把一个网页分为多个模块，由这些模块结构来构建出一个网页。

端碗吹水

2020/09/23

4.2K0

css中绝对定位_绝对定位和相对定位怎么用

bottom属性描述时，以首屏页面左下角为参考点如果浏览器不动，滚动条动的时候，红色盒子跟随页面动，红绿盒子间距不变。

全栈程序员站长

2022/11/17

2.6K0

css中绝对定位_绝对定位和相对定位怎么用

d3.js在博客园中的展示例子

<style><!-- .link { stroke: red; stroke-linejoin:bevel; } .link_error{ stroke:red; stroke-linejoin:bevel; } .nodetext { font: 12px sans-serif; -webkit-user-select:none; -moze-user-select:none; stroke-linejoin:bevel; } #conta

用户1174963

2018/01/17

1.1K0

在 Text 中实现基于关键字的搜索和定位

前些日子，一位网友在聊天室中就如下的问题[3] 与大家进行了交流与探讨 —— 如何通过 Text + AttributedString 实现类似文章关键字检索的功能，并可通过按钮在搜索结果中进行滚动切换？

东坡肘子

2022/12/16

4.2K0

在 Text 中实现基于关键字的搜索和定位

在Cookie中存储对象

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/huyuyang6688/article/details/46955119

DannyHoo

2018/09/13

3.8K0

JSON对象标记语法验证类

groovy apache https 网络安全 socket编程

在接触过JsonPath工具，我发现了使用标记语法编写文本形式的验证的可行性。在完成了基本JsonPath功能封装和Groovy终极重载操作符功能之后，自我感觉已经非常完善了，所以停了一阵子。之前的成果如下：

FunTester

2021/01/05

7380

浅谈对象的创建、内存布局和访问定位

java 编程算法存储

　　这里的对象的创建是指普通的对象（不包括数组和Class对象）。对象的创建简单来说就是执行new的时候，虚拟机做出对应的响应。让我们看看一下虚拟机创建对象的过程： 1.虚拟机遇到new指令时，首先尝试在常量池中定位到对应类的符号引用，并检查这个符号引用代表类是否已被加载、解析和初始化过。如果没有，那必须先执行相应的类加载过程（后续会写一下关于类加载的问题）。 2.类加载检查通过后，为新生对象分配内存。对象内存的大小在类加载完成后便可完全确定。对象内存分配有“指针碰撞”和“空闲列表”两种方法，“指针碰撞”是把已用内存放到指针的一边，未用的放到另一边，以指针分隔，当需要分配一个新对象内存时把指针往未分配内存那边移动相对应的空间即可；“空闲列表”是因为内存已用的和未用的并不是规整的，它们是交错的，所以需要一个列表记录内存块的情况。Java堆是线程之间共享的内存，虚拟机采用CAS配上失败重试的方式保证更新操作的原子性保证内存指针修改并发安全性；另一种方法是“本地线程分配缓冲（Thread Local Allocation Buffer TLAB）”。 3.将虚拟机分配到的内存空间初始化为零值。 4.对对象进行必要的设置。其实是对对象头编写。 5.完成上面4个步骤执行new指令后会接着执行方法到此对象才算完成生产出来。

GreizLiao

2019/09/24

7370

【文末送书】JAVA设计模式之组合模式，以统一的方式处理单个对象和组合对象

java 容器对象接口设计模式

组合模式是一种结构型设计模式，它允许你将对象组合成树状结构，并以递归方式处理这些对象。组合模式使得客户端可以以统一的方式处理单个对象和组合对象。

Designer 小郑

2023/10/10

6250

【文末送书】JAVA设计模式之组合模式，以统一的方式处理单个对象和组合对象

Scala简介：面向对象和函数式编程的组合

Scala简介 “Scala是一门现代的多范式编程语言，志在以简练、优雅及类型安全的方式来表达常用编程模式。它平滑地集成了面向对象和函数语言的特性。” Scala意在伸缩性，语言的伸缩性受许多因素影响，范围从语法细节到控件的抽象构造。如果我们一定要说出Scala中有助伸缩性的一个方面，我们会把面向对象和函数式编程的组合拣出来（呵呵，不厚道了一把，这的确是两个方面，但是纠缠在了一起）。 Scala在把面向对象和函数式编程熔合成一套语言的设计方面比其他众所周知的语言都走得更远。比方说，其他语言或许把对象和方

Albert陈凯

2018/04/04

1.2K0

机器学习在组合优化中的应用（上）

编程算法学习方法强化学习机器学习监督学习

运筹学自二战诞生以来，现已被广泛应用于工业生产领域了，比如交通运输、供应链、能源、经济以及生产调度等。离散优化问题（discrete optimization problems）是运筹学中非常重要的一部分，他们通常可以建模成整数优化模型进行求解，即通过决定一系列受约束的整数或者0-1变量，得出模型最优解。

短短的路走走停停

2021/03/04

3K0

在 JavaScript 中如何克隆对象？

json https javascript 网络安全编程算法

我们假设一个变量 name 具有一个与之关联的原始值（number，string，boolean，undefined 和null）。如果我们将此变量 name 复制到另一个变量name2 ，则原始变量的任何修改都不会影响到第二个变量，因为它们是原始值。

前端小智@大迁世界

2022/06/15

4.7K0

点击加载更多

相似问题

d3.js径向定位对象周围的元素

11

在spatstat中组合两个点模式对象创建组合标记

15

d3.js组合图线和散点图

11

使用d3.js定位xAxis和yAxis

10

组合<a>标记和<label>

42

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例