最近和兩個(gè)同學(xué)在開(kāi)發(fā)一個(gè)微信公眾平臺(tái)。我在寫一些鏈接頁(yè)面時(shí)，一開(kāi)始簡(jiǎn)單地寫了一些HTML頁(yè)面，在手機(jī)上測(cè)試顯示ok。后來(lái)，一個(gè)同學(xué)說(shuō)了我寫的頁(yè)面怎么能夠擴(kuò)大，他給我隨便演示的幾個(gè)微信鏈接頁(yè)面不能擴(kuò)大，讓我去改。于是我看了一部分他人的代碼，發(fā)現(xiàn)在他們的頁(yè)面頭部都有下面這么一部分代碼。

我沒(méi)有深入研究過(guò)HTML的meta標(biāo)簽，我上網(wǎng)查了資料，才弄明白怎么回事。

X-UA-Compatible是IE8專有的標(biāo)記，是用來(lái)指定Internet Explorer 8瀏覽器模擬摸個(gè)特定版本IE瀏覽器的渲染方式，以此來(lái)解決IE瀏覽器的兼容問(wèn)題。Edge 模式 通知Windows Internet Explorer已最高級(jí)別的可用模式顯示內(nèi)容。

設(shè)置可視區(qū)域，傳統(tǒng)桌面瀏覽器就是指除去所有工具欄、狀態(tài)欄、滾動(dòng)條等等之后用于看網(wǎng)頁(yè)的區(qū)域，移動(dòng)設(shè)備不一樣，需要設(shè)置。
width //寬度
initial-scale //初始縮放比例
maximum-scale //允許用戶縮放的最大比例
user-scalable //用戶是否可以用手縮放

下面的設(shè)置是針對(duì)蘋果設(shè)備的
<meta name="apple-mobile-web-app-capable" content="yes">
設(shè)置頁(yè)面是否全屏顯示，yes，web應(yīng)用全屏顯示
<meta name="apple-mobile-web-app-status-bar-style" content="black">
設(shè)置狀態(tài)欄的顏色，content可取default、black、black-translucent，對(duì)應(yīng)默認(rèn)，黑色和黑色透明。默認(rèn)和黑色，頁(yè)面在工具欄下顯示，黑色透明將全屏顯示
<meta name="format-detection" content="telephone=no">
設(shè)置在頁(yè)面中是否自動(dòng)識(shí)別電話號(hào)碼
body{ -webkit-touch-callout: none; -webkit-text-size-adjust: none; }
webkit-touch-callout:禁用長(zhǎng)按彈出效果，none禁用，default使用彈出效果
webkit-text-size-adjust：調(diào)整頁(yè)面文本大小，none不會(huì)自動(dòng)調(diào)整，auto自動(dòng)調(diào)整

<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="http://res.wx.qq.com/mmbizwap/zh_CN/htmledition/style/pc-page1b2f8d.css"/>
IE 9 使用的樣式
<![endif]-->
<link media="screen and (min-width:1000px)" rel="stylesheet" type="text/css" href="http://res.wx.qq.com/mmbizwap/zh_CN/htmledition/style/pc-page1b2f8d.css"/>
屏幕寬度大于1000px使用的樣式