移动端UC /QQ 浏览器的部分私有Meta 属性
<meta name="format-detection" content ="telephone=no"/> ?
格式檢測 禁止識別我們頁面中的數(shù)字,防止把其當(dāng)作電話識別,email=no 禁止識別郵箱
IOS設(shè)備對META的私有屬性
<meta name="apple-mobile-web-app-capable" content="yes">
? ?? 把蘋果手機(jī)safari上打開我們的頁面,把菜單隱藏顯示全屏? 網(wǎng)站開啟對web app的支持
<meta name="apple-mobile-web-app-status-bar-style"?content="black"?/>
- 在web app應(yīng)用下狀態(tài)條(屏幕頂部條)的顏色;
- 默認(rèn)值為default(白色),可以定為black(黑色)和black-translucent(灰色半透明)
- 若值為“black-translucent”將會占據(jù)頁面px位置,浮在頁面上方(會覆蓋頁面20px高度–iphone4和itouch4的Retina屏幕為40px)。
UC瀏覽器的部分私有Meta 屬性
設(shè)置屏幕方向為橫屏還是豎屏
<meta name="screen-orientation" content="portrait|landscape">設(shè)置是否全屏,yes表示強(qiáng)制瀏覽器全屏
<meta name="full-screen" content="yes">縮放不出滾動條
<meta name="viewport" content="uc-fitscreen=no|yes"/>設(shè)置no后用戶縮放與標(biāo)準(zhǔn)瀏覽器縮放一直,設(shè)置為yes后,用戶縮放金放到圖片和文字,不出現(xiàn)橫向滾動條。
排版
<meta name="layoutmode" content="fitscreen|standard" />fitscreen模式簡化頁面處理,適合頁面閱讀節(jié)省流量,standard模式和標(biāo)準(zhǔn)瀏覽器一致;一旦設(shè)置layoutmode meta后,用戶使用瀏覽器提供的的排版模式選項將會無效。
夜間模式
<meta name="nightmode" content="enable|disable"/>nightmode的值設(shè)置為disable后,即使用戶使用瀏覽器的夜間模式,頁面的表現(xiàn)也仍然是非夜間模式。
強(qiáng)制圖片顯示
<meta name="imagemode" content="force"/>UC瀏覽器為了節(jié)省流量,為用戶提供了無圖模式,但是如果頁面的圖片是必不可少的,如驗證碼的,需要強(qiáng)制瀏覽器顯示圖片,可以設(shè)置imagemode, 不影響子頁面。通過META設(shè)置圖片加載方式會作用于整個頁面,如果希望對單個圖片進(jìn)行設(shè)置,那么可以使用這個
<img src="" show="force">應(yīng)用模式
<meta name="browsermode" content="application"/>使用了application這種應(yīng)用模式后,頁面講默認(rèn)全屏,禁止長按菜單,禁止收拾,標(biāo)準(zhǔn)排版,以及強(qiáng)制圖片顯示。
QQ 瀏覽器x5內(nèi)核定制標(biāo)簽說明
設(shè)置屏幕方向
<meta name="x5-orientation" content="portrait|landscape" />設(shè)置全屏
<meta name="x5-fullscreen" content="true" />設(shè)置屏幕模式
<meta name="x5-page-mode" content="app" />對比
在實際使用的情況中,發(fā)現(xiàn)對于控制全屏的meta 標(biāo)簽,UC 跟QQ 處理的方式稍有不同:區(qū)別在于處理系統(tǒng)狀態(tài)欄,UC 是直接覆蓋系統(tǒng)狀態(tài)欄,而QQ 仍然保留之。從原生應(yīng)用的場景及用戶角度看,QQ 的這種“偽全屏”反而是更為友好。
說點廢話:升級到安卓微信最新版,發(fā)現(xiàn)微信內(nèi)置的瀏覽器已經(jīng)換為qq的x5瀏覽器內(nèi)核了,而非之前的采用默認(rèn)瀏覽器的內(nèi)核。這個改變值得肯定,畢竟對于質(zhì)量參差不齊的安卓默認(rèn)瀏覽器,x5瀏覽器內(nèi)核對于HTML5等的支持相對更加優(yōu)秀。加上目前微信的霸主地位,更多的H5場景可能更多是在微信內(nèi)置瀏覽器中展開。也從這個角度,UC瀏覽器市場占有率的數(shù)字岌岌可危——如果你將微信內(nèi)置瀏覽器歸為QQ 瀏覽器。
更多專業(yè)前端知識,請上 【猿2048】www.mk2048.com
總結(jié)
以上是生活随笔為你收集整理的移动端UC /QQ 浏览器的部分私有Meta 属性的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 点击左侧跳到右侧
- 下一篇: 2017年html5行业报告,云适配发布