Css 对于全宽（100%浏览器）滑块，好的本机图像大小是多少？

我正在建立一个网站，其中包括一个全宽度滑块；100%的浏览器窗口。 CSS是这样的

.slider {
    width:100%;
}

。。。其中滑块的父对象是

，而不是某个包装器div

我的困境是，如果我使用1600px宽度的图像，并使用CSS将其缩放到100%，那么对于最大化的浏览器（显示器宽度）小于1600px的任何人来说，这都是好的，因为图像将缩小而不是增大（暂时不考虑移动/响应大小）然而，在超大显示器上使用最大化浏览器的人会将该图像放大而不是缩小，从而使其外观略微退化

我检查了几个滑块，它们使用的图像宽度约为2000px，但是否有一个宽度不需要在大部分显示器上放大

---

请注意：我不是问CSS、网格系统、twitter引导、响应或自适应站点、960px宽度的网站或类似的问题。我也不是在说一个滑块，它是网站包装的100%。我只是询问用于创建滑块的图像文件的像素宽度，滑块的缩放比例为浏览器宽度的100%。

960px是网页任何内容区域的标准全宽，希望在全浏览器窗口中不会出现任何溢出

---

1920px是您想要达到的最高点。这被认为是屏幕分辨率大小的“高端”，任何更高的分辨率都会导致浏览器出现问题。只要您将幻灯片宽度设置为100%，它将调整到比1920分辨率更高的屏幕大小，而不会出现问题。这也将解决占用太多带宽的问题，并且不会影响加载时间（这是站点功能的关键）。

如上所述，标准宽度为960像素。 但是很多网站都在做自适应，所以你不能肯定。 例如，我的显示器的分辨率为2560x1440。没有人能做出如此大的站点分辨率

---

如果您想制作一个自适应站点作为监视器和移动设备，我只能建议您使用或类似的方法。您还可以使用网格系统，例如：

根据2013年全球屏幕分辨率统计，1920x1080的屏幕尺寸是当前十大最流行屏幕尺寸中的第四大。这也是迄今为止显示器的最后一个高清显示器

我认为这更多的是个人的选择，取决于你的目标受众。这些数据可能会帮助你做出明智的决定

为了赶上2019年的大分辨率显示设备，我建议尺寸为

2400x1600px

，采用优化的jpeg或下一代图像格式，并支持jpeg

<picture>
    <source srcset="sample_image.webp" type="image/webp">
    <source srcset="sample_image.jpg" type="image/jpg">
    <img src="sample_image.jpg" alt="">
</picture>

资料来源：

---

---

您甚至可以更聪明地采取许多步骤，使用支持图像优化和响应图像交付的CDN，如（提供免费层）或

您确定理解我的问题吗？我正在做一个100%宽度的滑块-100%的浏览器窗口。除非你动态地做，否则没有办法知道什么是100%像素，因为每个人的分辨率都不同。是的，顺便说一句，对不起，我认为我的问题没有把“全宽”说得很清楚。是的，我知道它必须是100%，我要问的是，关于从哪里开始的最佳指导原则是什么，或者换句话说，用户最有可能让其代理最大化的最大宽度是什么；为了避免放大图像。。。用另一种方式问它有一个物理监视器宽度，我们通常认为它“宽如它们通常得到的”抱歉看起来好像我没有问正确的问题-看我的编辑感谢你的全面回答，但是我不明白为什么你要把所有的列入…从css的角度来看，我所需要的就是.container{width:100%}，其中容器的父级是。。。我的问题纯粹与所用图像的像素宽度有关。。。再次抱歉，如果我没有说清楚。您生成列，以便您的图像将动态调整到屏幕大小。您可以将幻灯片设置为列宽的100%。因此，如果屏幕为960像素，则图像将生成16列的大小，如果屏幕为1060像素，则图像将基于18列生成。“列”实际上并不代表用户可以在屏幕上看到的物理网格，而是浏览器所扮演的网格，它使用语言的桥梁，根据每个屏幕分辨率在特定页面上确定内容的大小。这是一种响应迅速的web开发方法，如果您不想使用这种方法，那么1920年就足够了。如果你给它一个100%的宽度，它会自动调整。你走的越大，你使用的加载时间和带宽就越多，这只是浪费时间和空间。是的，我认为我不需要网格。1920可能是我想要的答案，但为什么是1920？我认为你的答案和其他答案一样（尽管我尽了最大努力）把我的问题和网站的标准宽度混淆了。相反，我问的是人们开发的最大的典型屏幕，不是wrt响应设计，而是wrt在100%带滑块的浏览器中使用的jpeg文件的像素宽度（在大屏幕上最大化时）。不要说“例如，我的显示器的分辨率是2560x1440。没有人能做出如此大的站点分辨率”，这是很有帮助的。读这篇文章，也许会有更多帮助：不。。AFAICT这根本不是我要问的，这个问题听起来像是关于调整显示器亮度的css的讨论-看看这个主题上的滑块，这是一个相当普遍的现象，在这种情况下，图像从2100像素缩小，这意味着如果任何人在超过2100px的显示器上最大化，这个主题将被打破。人们认为这应该是2019年的新选择答案吗？我有点担心