响应式网站中用法详解

 时间:2026-02-14 04:43:30

1、首页新建一个HTML5页面,如图

响应式网站中用法详解

2、需要手动在<head>头区域,加入viewport声明,示例:

<meta name="viewport" content="">

响应式网站中用法详解

3、其中,viewport声明中,content=""属性有5个参数可供设置,分别是:

width="deive-width",

initial-scale=1.0,

minimum-scale=0.8,

maximum-scale=1.5,

user-scalable=no

响应式网站中用法详解

4、其中,第一个参数width 和 第二个参数initial-scale 较为重要,

width=device-width, 指明了网页的宽度默认等于用户设备的屏幕宽度

initial-scale=1.0, 指明了网页的初始化宽度实际所在屏幕宽度的比例,取值范围为0.1-1.0,即10%-100%

响应式网站中用法详解

5、其余三个参数的,意义分别为:

minimum-scale=0.8, 指明了网页最小允许缩小到屏幕80%的宽度

maximum-scale=1.5, 指明了网页最大允许放大到屏幕150%的宽度

user-scalable=no, 指明了网页禁止用户缩放,允许用户缩放则使用yes

响应式网站中用法详解

  • css设置英文字体间距
  • html+css3实现旋转太极效果
  • word2010怎么插入图片
  • 网页初学者表格中插入图片,有间隙结局办法
  • html的标签自适应不居中
  • 热门搜索
    重庆旅游攻略景点必去 福建旅游攻略 昆山旅游 旅游地产 云南旅游线路 旅游圣地 韩国旅游景点 西双版纳旅游攻略 太原旅游职业学院 毕节旅游