您的位置 : 網站首頁 > 幫助中心  >  使用說明

手機網站各種meta解釋說明

一、<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

	1.name="viewport"      //設置視口(網頁可繪制的區域)
	
	2.width=device-width    //應用程序的寬度和屏幕的寬度是一樣的
	
	3.height=device-height  //應用程序的高度和屏幕的高是一樣的
	
	4.initial-scale=1.0  //應用程序啟動時候的縮放尺度(1.0表示不縮放)
	
	5.minimum-scale=1.0  //用戶可以縮放到的最小尺度(1.0表示不縮放)
	
	6.maximum-scale=1.0  //用戶可以放大到的最大尺度(1.0表示不縮放)
	
	7.user-scalable=no  //用戶是否可以通過他的手勢來縮放整個應用程序,使應用程序的尺度發生一個改變(yes/no)
二、<meta name="viewport" content="target-densitydpi=device-dpi, width=480px, user-scalable=no">

	1.target-densitydpi=device-dpi     //指定屏幕像素密度DPI,device-dpi 為設備原本的DPI值,不會有任何縮放.( dpi是單位,一般指每英寸的像素)
三、<meta name="apple-mobile-web-app-capable" content="yes"> 

	//說明:網站開啟對web app程序的支持
	
	1.apple-mobile-web-app-capable //
	
	2.content="yes"  //是否開啟(開啟)
四、<meta http-equiv="X-UA-Compatible" content="IE=edge"> //強制使用ie最新內核模式渲染
五、<meta name="format-detection" content="telephone=no">

	當該 HTML 頁面在手機上瀏覽時,該標簽用于指定是否將網頁內容中的手機號碼顯示為撥號的超鏈接
	
	在 iPhone 上默認值是:
	
	<meta name="format-detection" content="telephone=yes"/>
	
	如果你不希望手機自動將網頁中的電話號碼顯示為撥號的超鏈接,那么可以這樣寫:
	
	<meta name="format-detection" content="telephone=no"/>
六、<meta content="email=no" name="format-detection" />//將不識別郵箱,告訴設備忽略將頁面中的數字識別為電話號碼 。
七、<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)。
八、<meta name="apple-touch-fullscreen" content="yes">  //"添加到主屏幕“后,全屏顯示
九、<meta name="apple-mobile-web-app-capable" content="yes" />

	//這meta的作用就是刪除默認的蘋果工具欄和菜單欄。content有兩個值”yes”和”no”,當我們需要顯示工具欄和菜單欄時,這個行meta就不用加了,默認就是顯示。
十、蘋果web app其他設置:

	1).<link rel="apple-touch-icon-precomposed" href="iphone_milanoo.png" />
	
	說明:這個link就是設置web app的放置主屏幕上icon文件路徑。
	
	使用:該路徑需要注意的就是放到將網站的文檔根目錄下但不是服務器的文檔的根目錄。圖片尺寸可以設定為57*57(px)或者Retina可以定為114*114(px),ipad尺寸為72*72(px)。
	
	2).<link rel="apple-touch-startup-image" href="milanoo_startup.png" />
	
	說明:這個link就是設置啟動時候的界面(圖片五),放置的路勁和上面類似。
	
	使用:該路徑需要注意的就是放到將網站的文檔根目錄下但不是服務器的文檔的根目錄。官方規定啟動界面的尺寸必須為 320*640(px),原本以為Retina屏幕可以支持雙倍,但是不支持,圖片顯示不出來。
十一、<META NAME="MobileOptimized" CONTENT="240">
	
	//瀏覽器不會自動調整文件的大小,也就是說是固定大小,不會隨著瀏覽器拉伸縮放。

本頁網址:http://www.qsxyor.icu/newsv_98.html
關鍵詞:meta |
十年獨立網站程序開發、網站美工經驗。所有網站程序均為原創開發,絕不使用免費網站程序修改。原創版網站絕不會再賣給第三方使用。所售出網站程序請不要給第三方使用。
2019王中王