媒体查询max-width＆amp;最小宽度差异以及如何为不同设备编写代码

Question

媒体查询定义的内容和定义方式。 @media（min-width：px）和@media（max-width：px）之间有所不同。如何设置尺寸和不同视口的值。

Answer 1

您是否在询问如何设置媒体查询？这是在CSS中的方法：

@media only screen and (min-width: 480px) and (max-width: 979px) {
  /* Your styles here */
}

此屏幕尺寸从480px到最大979px（通常是平板电脑肖像尺寸）。它可能需要很多参数，例如设备分辨率，像素比，媒体类型（例如“打印”）等。

您也可以直接在链接上执行此操作，如下所示：
<link rel="stylesheet" media="(max-width: 979px)" href="mystylesheet.css">

Mozilla有一些关于媒体查询的精彩文档：https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries