html中的meta详解
生活随笔
收集整理的這篇文章主要介紹了
html中的meta详解
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
轉(zhuǎn)自http://www.cnblogs.com/javaee6/p/3730750.html
1? name=viewport
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />1、width :?控制viewport的大小，可以指定一個(gè)值，如600， 或者特殊的值，如device-width為設(shè)備的寬度（單位為縮放為100%的CSS的像素）
2、height :?和width相對(duì)應(yīng)，指定高度
3、initial-scale :?初始縮放比例，頁(yè)面第一次加載時(shí)的縮放比例
4、maximum-scale :?允許用戶縮放到的最大比例，范圍從0到10.0
5、minimum-scale :?允許用戶縮放到的最小比例，范圍從0到10.0
6、user-scalable :?用戶是否可以手動(dòng)縮放，值可以是：①yes、 true允許用戶縮放；②no、false不允許用戶縮放
2? meta中的name屬性
<!--用以說明生成工具--> <meta name="Generator" content=""> <!--向搜索引擎說明你的網(wǎng)頁(yè)的關(guān)鍵詞--> <meta name="Keywords" content=""> <!-- 告訴搜索引擎你的站點(diǎn)的主要內(nèi)容--> <meta name="Description" content=""> <!-- 告訴搜索引擎你的站點(diǎn)的制作的作者 --> <meta name="Author" content="你的姓名"> <meta name="Robots" content= "all|none|index|noindex|follow|nofollow"> <!-- 設(shè)定為all：文件將被檢索，且頁(yè)面上的鏈接可以被查詢； 設(shè)定為none：文件將不被檢索，且頁(yè)面上的鏈接不可以被查詢； 設(shè)定為index：文件將被檢索； 設(shè)定為follow：頁(yè)面上的鏈接可以被查詢； 設(shè)定為noindex：文件將不被檢索，但頁(yè)面上的鏈接可以被查詢； 設(shè)定為nofollow：文件將不被檢索，頁(yè)面上的鏈接可以被查詢。 -->3? meta中的 http-equiv屬性
<!--設(shè)置字符編碼和文件格式--> <meta http-equiv="Content-Type" content="text/html";charset=utf-8"> <!--設(shè)置定時(shí)刷新--> <meta http-equiv="Refresh" content="n;url=http://.......> <!-- 告訴瀏覽器不要緩存頁(yè)面--> <meta http-equiv="Pragma" content="no-cache"> <! -- //告訴瀏覽器不要緩存頁(yè)面--> <meta http-equiv="cache-control" content="no-cache">//告訴瀏覽器不要緩存頁(yè)面 <!--禁用瀏覽器緩存此頁(yè)面--> <meta http-equiv="expires" content="0"> <!--設(shè)置ie的文檔兼容模式,設(shè)置IE7+的瀏覽器以IE7的兼容模式查看頁(yè)面--> <meta http-equiv="X-UA-Compatible" content="IE=7">4 html5中更多的meta與link
<!DOCTYPE html> <!-- HTML5 doctype 不區(qū)分大小寫 --> <html lang="zh"> <!-- 更加標(biāo)準(zhǔn)的 lang 屬性寫法 http://zhi.hu/XyIa --><head> <meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <!-- 優(yōu)先使用IE最新版本和 Chrome --> <meta name="renderer" content="webkit|ie-comp|ie-stand"> <!-- 360 瀏覽器內(nèi)核控制 --> <!-- content的取值為webkit,ie-comp,ie-stand之一，區(qū)分大小寫，分別代表用webkit內(nèi)核，IE兼容內(nèi)核，IE標(biāo)準(zhǔn)內(nèi)核。 若頁(yè)面需默認(rèn)用極速核，增加標(biāo)簽：<meta name="renderer" content="webkit"> 若頁(yè)面需默認(rèn)用ie兼容內(nèi)核，增加標(biāo)簽：<meta name="renderer" content="ie-comp"> 若頁(yè)面需默認(rèn)用ie標(biāo)準(zhǔn)內(nèi)核，增加標(biāo)簽：<meta name="renderer" content="ie-stand"> --><!-- width=device-width 會(huì)導(dǎo)致 iPhone 5 添加到主屏后以 WebAPP 全屏模式打開頁(yè)面時(shí)出現(xiàn)黑邊 http://bigc.at/ios-webapp-viewport-meta.orz --> <meta name ="viewport" content ="initial-scale=1.0, maximum-scale=3, minimum-scale=1, user-scalable=no"><meta name="apple-mobile-web-app-title" content="標(biāo)題"> <!-- 添加到主屏?xí)r的標(biāo)題 --><meta name="apple-mobile-web-app-capable" content="yes" /> <!-- 是否啟用 WebAPP 全屏模式 --><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <!-- 狀態(tài)條顏色 --><meta name="format-detection" content="telephone=no" /> <!-- 屏蔽數(shù)字自動(dòng)識(shí)別為電話號(hào)碼 --><!-- favicon 圖標(biāo) --> <link type="image/x-icon" rel="icon" href="http://static.example.com/favicon.ico"/> <link type="image/x-icon" rel="shortcut icon" href="http://static.example.com/favicon.ico"/> <link type="image/x-icon" rel="bookmark" href="http://static.example.com/favicon.ico"/><!-- iOS 圖標(biāo) begin --> <!--默認(rèn) 57x57 像素--> <link rel="apple-touch-icon-precomposed" href="http://wanke.etao.com/assets/img/icon/57/apple-touch-icon-57x57-precomposed.png" /> <!--iPad 1 72x72 像素--> <link rel="apple-touch-icon-precomposed" sizes="72x72" href="http://wanke.etao.com/assets/img/icon/72/apple-touch-icon-72x72-precomposed.png" /> <!--iPhone 4 114x114 像素--> <link rel="apple-touch-icon-precomposed" sizes="114x114" href="http://wanke.etao.com/assets/img/icon/114/apple-touch-icon-114x114-precomposed.png" /> <!-- iOS 圖標(biāo) end --><meta name="msapplication-TileColor" content="#000"/> <!-- Windows 8 磁貼顏色 --> <meta name="msapplication-TileImage" content="icon.png"/> <!-- Windows 8 磁貼圖標(biāo) --><!-- SEO 優(yōu)化 --> <meta name="description" content="" /> <!-- 頁(yè)面描述 --> <meta name="keywords" content=""/> <!-- 頁(yè)面關(guān)鍵詞 --> <title>頁(yè)面標(biāo)題</title><!-- iOS 應(yīng)用啟動(dòng)界面設(shè)置 begin --> <!-- iPad Landscape – 1024 x 748 --> <link rel="apple-touch-startup-image" sizes="1024x748" href="img/splash-screen-1024x748.png" /> <!-- iPad Portrait – 768 x 1004 --> <link rel="apple-touch-startup-image" sizes="768x1004" href="img/splash-screen-768x1004.png" /> <!-- iPhone/iPod Touch Portrait – 320 x 480 (standard resolution) --> <link rel="apple-touch-startup-image" href="img/splash-screen-320x480.png" /> <!-- iPhone/iPod Touch Portrait – 640 x 960 pixels (high-resolution) --> <link rel="apple-touch-startup-image" sizes="640x960" href="img/splash-screen-640x960.png" /> <!-- iOS 應(yīng)用啟動(dòng)界面設(shè)置 end --></head>轉(zhuǎn)載于:https://www.cnblogs.com/shuishuowobushihuiyuan/p/3732020.html
總結(jié)
以上是生活随笔為你收集整理的html中的meta详解的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： scp报错：not a regular
- 下一篇： Android -- 短信