meta标签
meta标签永远都在head元素内
<!--设置页面编码-->
<meta charset="UTF-8">
<!--页面描述-->
<meta name="description" content="这里的文字描述网站内容的"/>
<!--设置页面关键字-->
<meta name="keywords" content="HTML CSS JavaScript"/>
<!--设置页面缓存方式-->
<meta http-equiv="cache-control" content="no-cache" />
<!--声明作者信息-->
<meta name="author" content="guxing,2357966040@qq.com"/>
<!--指定渲染引擎的类型和版本-->
<meta http-equiv="X-UA-Compatible" content="ie=edge"/>
<!--移动端关闭电话号码识别-->
<meta name="format-detection" content="telephone=no" />
<!--关闭邮箱地址识别-->
<meta name="format-detection" content="email=no" />
<!--如果想同时关闭电话和邮箱识别,可以把它们写到一条 meta 内-->
<meta name="format-detection" content="telephone=no,email=no" />
<!--解决防盗链-->
<meta name="referrer" content="never"/>
用于移动端开发:
<meta name="viewport" content="width=device-width,initial-
scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
布局视口:手机生产的时候就已经设置好的,为让更多的内容放到移动端的屏幕上。
设备视口:通常我们看到的移动设备。
物理像素:通常指我们所说的屏幕分辨率。比如ip6:750*1344
逻辑像素:指的是程序上写的像素值。比如ip6: 375*667
理想视口:就是让布局视口等于设备视口大小。
设备像素比:可以通过window.devicePixelRatio查询
比如ip6的设备像素比:2
逻辑像素=物理像素/设备像素比
网友评论