<meta name="format-detection" content ="telephone=no"/>
格式檢測 禁止識別我們頁面中的數字,防止把其當作電話識別,email=no 禁止識別郵箱
IOS設備對META的私有屬性
<meta name="apple-mobile-web-app-capable" content="yes">
把蘋果手機safari上打開我們的頁面,把菜單隱藏顯示全屏 網站開啟對web app的支持
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
- 在web app應用下狀態條(屏幕頂部條)的顏色;
- 默認值為default(白色),可以定為black(黑色)和black-translucent(灰色半透明)
- 若值為“black-translucent”將會占據頁面px位置,浮在頁面上方(會覆蓋頁面20px高度–iphone4和itouch4的Retina屏幕為40px)。
UC瀏覽器的部分私有Meta 屬性
設置屏幕方向為橫屏還是豎屏
<meta name="screen-orientation" content="portrait|landscape">
設置是否全屏,yes表示強制瀏覽器全屏
<meta name="full-screen" content="yes">
縮放不出滾動條
<meta name="viewport" content="uc-fitscreen=no|yes"/>
設置no后用戶縮放與標准瀏覽器縮放一直,設置為yes后,用戶縮放金放到圖片和文字,不出現橫向滾動條。
排版
<meta name="layoutmode" content="fitscreen|standard" />
fitscreen模式簡化頁面處理,適合頁面閱讀節省流量,standard模式和標准瀏覽器一致;一旦設置layoutmode meta后,用戶使用瀏覽器提供的的排版模式選項將會無效。
夜間模式
<meta name="nightmode" content="enable|disable"/>
nightmode的值設置為disable后,即使用戶使用瀏覽器的夜間模式,頁面的表現也仍然是非夜間模式。
強制圖片顯示
<meta name="imagemode" content="force"/>
UC瀏覽器為了節省流量,為用戶提供了無圖模式,但是如果頁面的圖片是必不可少的,如驗證碼的,需要強制瀏覽器顯示圖片,可以設置imagemode, 不影響子頁面。通過META設置圖片加載方式會作用於整個頁面,如果希望對單個圖片進行設置,那么可以使用這個
<img src="" show="force">
應用模式
<meta name="browsermode" content="application"/>
使用了application這種應用模式后,頁面講默認全屏,禁止長按菜單,禁止收拾,標准排版,以及強制圖片顯示。
QQ 瀏覽器x5內核定制標簽說明
設置屏幕方向
<meta name="x5-orientation" content="portrait|landscape" />
設置全屏
<meta name="x5-fullscreen" content="true" />
設置屏幕模式
<meta name="x5-page-mode" content="app" />
對比
在實際使用的情況中,發現對於控制全屏的meta 標簽,UC 跟QQ 處理的方式稍有不同:區別在於處理系統狀態欄,UC 是直接覆蓋系統狀態欄,而QQ 仍然保留之。從原生應用的場景及用戶角度看,QQ 的這種“偽全屏”反而是更為友好。
說點廢話:升級到安卓微信最新版,發現微信內置的瀏覽器已經換為qq的x5瀏覽器內核了,而非之前的采用默認瀏覽器的內核。這個改變值得肯定,畢竟對於質量參差不齊的安卓默認瀏覽器,x5瀏覽器內核對於HTML5等的支持相對更加優秀。加上目前微信的霸主地位,更多的H5場景可能更多是在微信內置瀏覽器中展開。也從這個角度,UC瀏覽器市場占有率的數字岌岌可危——如果你將微信內置瀏覽器歸為QQ 瀏覽器。