Php 如何在html css布局中使用媒体查询

请告诉我如何使用iPhone的媒体查询。我无法理解如何为两台设备（如321至479）以及其他设备编写媒体查询

---

请告诉我如何在其他设备中更改响应媒体查询。

就这么简单，无论您测试的是哪款手机

@media(max-width:767px) {
  Here you can define all the responsive styles for mobile view. You can 
  resize the screen to the smallest screen resolution i.e iphone 4 320 * 
  480. So according to whatever the size is required, you can just define 
  it once. It will be applicable to all the devices.
}

---

媒体查询不针对特定设备（如iPhone），而是针对屏幕宽度（如

最小宽度：767px

和

最大宽度：1024px

）以及设备和显示器类别（打印、屏幕）

这里有一个方便的教程：

使用：@media all和（最大宽度：200px）{

}

当宽度小于指定的最大宽度时，将应用您在其中放置的内容。

---

因此，在笔记本电脑上，例如，如果somone将浏览器大小调整到200 px以下，则内部样式将应用，如果手机屏幕的宽度小于指定的最大宽度，则样式将自动应用。

如何对iPhone使用媒体查询如何就StackOverflow问一个好问题：另外，这与PHPY无关。你没有解释最小宽度和最大宽度，也没有纠正OP的假设，即他瞄准的是设备，而不是屏幕宽度。@YvonneAburrow我同意你的看法，他瞄准的是特定的宽度，但在下一行中，他还要求其他设备，因此，与其给他一个特定的宽度解决方案

@media（最大宽度：767px）

更好，它涵盖了所有的小型设备。这不仅仅是关于Iphone。还有其他的手机需要改进。为特定分辨率提供解决方案并不是一个解决方案。我知道，这就是为什么我在发言前解释了一个事实，即我们的目标是屏幕宽度，而不是设备

@media screen and (max-width: 479px) and (min-width: 321px) {
    div.page {
       padding: 0.5em;
     }
}