我正在学习响应式图像，并且想知道我是否设置了宽度为100px且高度为100px的图像，那么，在高分辨率屏幕上它会更小吗？以像素（px）（字体大小，宽度等）设置的所有内容在不同分辨率屏幕上的显示方式是否不同，开发人员是否需要考虑到这一点？
答案 0 :(得分：1)
阅读响应式网页设计 https://www.w3schools.com/html/html_responsive.asp ..
您可以使用各种配置（如设置
）为不同设备优化单个网站设计 viewport
这将设置页面的视口，这将为浏览器提供有关如何控制页面尺寸和缩放的说明。
Using the width Property
宽度：
<img src="answer.jpg" style="width:100%;"> - 如果需要，设置width属性可以放大和缩小图像。但是要注意width属性，可以将图像放大到比原始大小更大。因此，您可以使用max-width
最大宽度：
<img src="img_girl.jpg" style="max-width:100%;height:auto;">
如果max-width属性设置为100％，则图像将缩小（如果必须），但不会向上扩展到大于其原始大小。
Responsive Text Size
您可以使用"vw" unit代表视口宽度，这意味着文本将与浏览器窗口匹配。
Media Queries
您可以随时为不同的浏览器尺寸定义完全不同的样式。
@media (max-width:800px) {
.left, .main, .right {
width:100%; /*The width is 100%, when the viewport is 800px or smaller*/
}
}
Frameworks
很多框架已经为您完成了这项工作，并且为了避免从头开始，您可以使用它们。一个例子是Semantic UI。 这些框架中的大多数已经遵循最佳实践，因此使用它们会非常棒，而且大多数都是社区驱动的。
答案 1 :(得分：1)
是的，网页正在针对多个设备进行优化。有许多技术可供使用，你一定要继续学习它们。这些知识不仅对编码人员至关重要，对图形设计师也很有用。
您经常可以使用CSS Media Queries或source srcset in the context of an img tag查看网页。例如，可以在https://www.apple.com/ - ＆gt;处看到一个经典。检查页面源以查看发生了什么。在@CSS Tricks等网站上有很多关于此问题的好文章。
答案 2 :(得分：1)
这个问题有很多。最基本的，是的，如果你为一个元素设置特定的像素尺寸，那么这将在不同的设备上显示为相同的像素数，但由于像素密度的变化可能会有不同的物理尺寸。
CSS中的（用于设置网页样式的语言）还有其他单位，例如%，em和vw/vh/vmin/vmax，这些单位相对于某些东西，这些单位可以让开发人员放置元素以更灵活的方式更改屏幕尺寸。
最后有@media-query个开发者根据屏幕是一种尺寸还是另一种尺寸提供不同的尺寸。例如，您可能希望元素在小屏幕上占据整个屏幕宽度，但在较大的屏幕上只占用屏幕的一部分。
查看w3schools了解详情，尤其是css units和responsive design
答案 3 :(得分：1)
PX是一个设定的大小。这意味着，计算机上元素的高度与平板电脑的高度相同。它不会调整大小。使用％，em，vw或其他，它们是可调整大小的，它们将根据屏幕大小进行调整。您可以在运行程序时通过调整窗口大小进行测试。