CSS媒体查询（Media Queries）介绍

        @media 实现手机和电脑屏幕的自适应效果

        读完此文可以参考上面的例子

           CSS媒体查询（Media Queries）是一种强大的工具，它允许开发者根据不同的设备特性（如屏幕大小、分辨率、颜色能力等）来应用不同的CSS规则。`@media`规则是媒体查询的核心，它使得响应式设计成为可能。在本文中，我们将详细探讨`@media`规则的用法，包括其基本语法、不同类型的媒体特性、使用场景以及最佳实践。

        基本语法

`@media`规则的基本语法如下：

  
@media mediatype and (media feature) {
  /* CSS rules */
}