meta标签
meta元素提供页面相关的元信息，比如针对搜索引擎和更新频率的描述和关键词。
- 必要属性 content ：提供http-equiv和name属性相关的的元信息，content必须配合这两个属性一起使用
- 可选属性为name，http-equiv。
name属性
name属性可选值为keywords,description等，将content内容关联在这个名称上，eg：
<meta name="keywords" content="HTML,ASP,PHP,SQL">
这行代码提供了网页包含的关键字，有利于搜索引擎的检索。
http-equiv
http-equiv 属性为名称/值对提供了名称。并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对。
使用带有 http-equiv 属性的 <meta> 标签时，服务器将把名称/值对添加到发送给浏览器的内容头部。例如，添加：
<meta http-equiv="charset" content="iso-8859-1">
<meta http-equiv="expires" content="31 Dec 2008">
这样发送到浏览器的头部就应该包含：
content-type: text/html
charset:iso-8859-1
expires:31 Dec 2008
当然，只有在浏览器可以接受这些附加的头部字段，并且能正确使用它们的时候，才有意义
移动端的一些头标签
`<meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">`
在桌面开发的时候可以让IE浏览器以最新的模式渲染页面.
viewport
<meta name="viewport" content="width=device-width, initial-scale=1，user-scalable=no,maximum-scale=1.0">
viewport的属性有很多
content 参数：
- width viewport 宽度(数值/device-width)
- height viewport 高度(数值/device-height)
- initial-scale 初始缩放比例
- maximum-scale 最大缩放比例
- minimum-scale 最小缩放比例
- user-scalable 是否允许用户缩放(yes/no)
语言属性lang
<html lang="zh-cmn-Hans"> <!-- 更加标准的 lang 属性写法 >
声明文档编码
<meta charset="utf-8"> 这行代码等效于
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
建议使用较短的，方便记忆
css媒体查询（media query）
使用方法：
1 .如果在html中直接使用css，那么在css代码的最后添加媒体查询，因为如果在前面添加，属性可能被后面的代码所覆盖
#test{
background:#ff0;
height:50px;
width:100%;
}
@media screen and (min-width=600px) and (max-width=900px){
#test{background:#f00;} //屏幕宽度在600-900px时背景色变为红色。
}
2 .如果引入外部css文件：
<link rel="stylesheet" media="screen and ((min-width=600px) and (max-width=900px))" href="test.css">
