web项目中经常会出现html页面需要自适应手机屏幕的情况
你想要让 HTML 网页的宽度能够自动适配手机等不同尺寸的屏幕，核心是要让网页布局根据视口（viewport）宽度自适应调整。
使用meta标签：viewport
这是实现移动端适配的基础，必须首先设置。它告诉浏览器如何控制页面的尺寸和缩放。
<!-- 核心视口设置 -->
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=no">
视口标签参数解释：
width=device-width：将页面宽度设置为设备的屏幕宽度（核心）。initial-scale=1.0：页面初始缩放比例为 1（不缩放）。maximum-scale=1.0：禁止用户放大页面（可选，根据需求调整）。user-scalable=no：禁止用户手动缩放页面（可选）。
