html5手机网站需要加的那些meta标签,手机网站自适应
生活随笔
收集整理的這篇文章主要介紹了
html5手机网站需要加的那些meta标签,手机网站自适应
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
1、移動(dòng)網(wǎng)站要加的html5相關(guān)meta和標(biāo)簽
? ? a、<!-- 強(qiáng)制讓文檔與設(shè)備的寬度保持1:1 -->
? ? <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
? ? 網(wǎng)頁寬度默認(rèn)等于屏幕寬度(width=device-width),
? ? 初始縮放比例(initial-scale=1)為1.0,即網(wǎng)頁初始大小占屏幕面積的100%。
? ? b、<!-- 刪除默認(rèn)的蘋果工具欄和菜單欄 -->
? ? <meta name="apple-mobile-web-app-capable" content="yes">
? ? c、<!-- 在web app應(yīng)用下狀態(tài)條(屏幕頂部條)的顏色 -->
? ? <meta name="apple-mobile-web-app-status-bar-style" content="black" />
? ? d、<!-- 禁止了把數(shù)字轉(zhuǎn)化為撥號(hào)鏈接 -->
? ? <meta name="format-detection" content="telephone=no">
? ? e、<!-- 瀏覽網(wǎng)站時(shí)的小圖標(biāo) -->
? ? <link rel="shortcut icon" href="http://p.www.xiaomi.com/favicon.ico" type="/image/x-icon"> ?
? ? f、<!-- 添加至主屏?xí)r的圖片 -->
? ? <link rel="apple-touch-icon-precomposed" href="http://a.tbcdn.cn/mw/s/hi/tbtouch/images/touch-icon.png">
? ? ==================
? ? 還有一種有趣的方法
? ? 創(chuàng)建html5時(shí)發(fā)現(xiàn)這么一句話,如下:
? ? <meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″/>
? ? a、<!-- 強(qiáng)制讓文檔與設(shè)備的寬度保持1:1 -->
? ? <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no">
? ? 網(wǎng)頁寬度默認(rèn)等于屏幕寬度(width=device-width),
? ? 初始縮放比例(initial-scale=1)為1.0,即網(wǎng)頁初始大小占屏幕面積的100%。
? ? b、<!-- 刪除默認(rèn)的蘋果工具欄和菜單欄 -->
? ? <meta name="apple-mobile-web-app-capable" content="yes">
? ? c、<!-- 在web app應(yīng)用下狀態(tài)條(屏幕頂部條)的顏色 -->
? ? <meta name="apple-mobile-web-app-status-bar-style" content="black" />
? ? d、<!-- 禁止了把數(shù)字轉(zhuǎn)化為撥號(hào)鏈接 -->
? ? <meta name="format-detection" content="telephone=no">
? ? e、<!-- 瀏覽網(wǎng)站時(shí)的小圖標(biāo) -->
? ? <link rel="shortcut icon" href="http://p.www.xiaomi.com/favicon.ico" type="/image/x-icon"> ?
? ? f、<!-- 添加至主屏?xí)r的圖片 -->
? ? <link rel="apple-touch-icon-precomposed" href="http://a.tbcdn.cn/mw/s/hi/tbtouch/images/touch-icon.png">
? ? ==================
? ? 還有一種有趣的方法
? ? 創(chuàng)建html5時(shí)發(fā)現(xiàn)這么一句話,如下:
? ? <meta http-equiv=”X-UA-Compatible” content=”IE=edge,chrome=1″/>
? ? 這樣寫可以達(dá)到的效果是如果安裝了GCF(Google Chrome Frame 谷歌內(nèi)嵌瀏覽器框架的簡稱),則使用GCF來渲染頁面,如果沒安裝GCF,則使用最高版本的IE內(nèi)核進(jìn)行渲染。這個(gè)插件可以讓用戶的IE瀏覽器外不變,但用戶在瀏覽網(wǎng)頁時(shí),實(shí)際上使用的是Google Chrome瀏覽器內(nèi)核,而且支持IE6、7、8等多個(gè)版本的IE瀏覽器。
總結(jié)
以上是生活随笔為你收集整理的html5手机网站需要加的那些meta标签,手机网站自适应的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 传感器与自动变速器
- 下一篇: c语言输出变量案例,C语言经典例题100