meta標(biāo)簽
meta元素提供頁(yè)面相關(guān)的元信息，比如針對(duì)搜索引擎和更新頻率的描述和關(guān)鍵詞。
- 必要屬性 content ：提供http-equiv和name屬性相關(guān)的的元信息，content必須配合這兩個(gè)屬性一起使用
- 可選屬性為name，http-equiv。
name屬性
name屬性可選值為keywords,description等，將content內(nèi)容關(guān)聯(lián)在這個(gè)名稱上，eg：
<meta name="keywords" content="HTML,ASP,PHP,SQL">
這行代碼提供了網(wǎng)頁(yè)包含的關(guān)鍵字，有利于搜索引擎的檢索。
http-equiv
http-equiv 屬性為名稱/值對(duì)提供了名稱。并指示服務(wù)器在發(fā)送實(shí)際的文檔之前先在要傳送給瀏覽器的 MIME 文檔頭部包含名稱/值對(duì)。
使用帶有 http-equiv 屬性的 <meta> 標(biāo)簽時(shí)，服務(wù)器將把名稱/值對(duì)添加到發(fā)送給瀏覽器的內(nèi)容頭部。例如，添加：
<meta http-equiv="charset" content="iso-8859-1">
<meta http-equiv="expires" content="31 Dec 2008">
這樣發(fā)送到瀏覽器的頭部就應(yīng)該包含：
content-type: text/html
charset:iso-8859-1
expires:31 Dec 2008
當(dāng)然，只有在瀏覽器可以接受這些附加的頭部字段，并且能正確使用它們的時(shí)候，才有意義
移動(dòng)端的一些頭標(biāo)簽
`<meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">`
在桌面開(kāi)發(fā)的時(shí)候可以讓IE瀏覽器以最新的模式渲染頁(yè)面.
viewport
<meta name="viewport" content="width=device-width, initial-scale=1，user-scalable=no,maximum-scale=1.0">
viewport的屬性有很多
content 參數(shù)：
- width viewport 寬度(數(shù)值/device-width)
- height viewport 高度(數(shù)值/device-height)
- initial-scale 初始縮放比例
- maximum-scale 最大縮放比例
- minimum-scale 最小縮放比例
- user-scalable 是否允許用戶縮放(yes/no)
語(yǔ)言屬性lang
<html lang="zh-cmn-Hans"> <!-- 更加標(biāo)準(zhǔn)的 lang 屬性寫(xiě)法 >
聲明文檔編碼
<meta charset="utf-8"> 這行代碼等效于
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
建議使用較短的，方便記憶
css媒體查詢（media query）
使用方法：
1 .如果在html中直接使用css，那么在css代碼的最后添加媒體查詢，因?yàn)槿绻谇懊嫣砑樱瑢傩钥赡鼙缓竺娴拇a所覆蓋
#test{
background:#ff0;
height:50px;
width:100%;
}
@media screen and (min-width=600px) and (max-width=900px){
#test{background:#f00;} //屏幕寬度在600-900px時(shí)背景色變?yōu)榧t色。
}
2 .如果引入外部css文件：
<link rel="stylesheet" media="screen and ((min-width=600px) and (max-width=900px))" href="test.css">
