一、什麼是viewport
手機瀏覽器是把頁面放在乙個虛擬的「視窗」（viewport）中，通常這個虛擬的「視窗」（viewport）比螢幕寬，這樣就不用把每個網頁擠到很小的視窗中，也不會破壞沒有針對手機瀏覽器優化的網頁的布局，使用者可以通過平移和縮放來看網頁的不同部分。移動版的 safari 瀏覽器最新引進了viewport 這個 meta tag，讓網頁開發者來控制 viewport 的大小和縮放，其他手機瀏覽器也基本支援。
二、viewport基礎
乙個常用的針對移動網頁優化過的頁面的 viewport meta 標籤大致如下：
1、width :控制viewport的大小，可以指定乙個值，如600， 或者特殊的值，如device-width為裝置的寬度（單位是縮放為100%的css的畫素）
2、height :和width相對應，指定高度
3、initial-scale :初始縮放比例，頁面第一次載入時的縮放比例
4、maximum-scale :允許使用者縮放到的最大比例，範圍從0到10.0
5、minimum-scale :允許使用者縮放到的最小比例，範圍從0到10.0
6、user-scalable :使用者是否可以手動縮放，值可以是：①yes、 true允許使用者縮放；②no、false不允許使用者縮放
三、關於viewport的一些問題
viewport並非只是ios上的獨有屬性，在android、winphone上同樣也有viewport。它們要解決的問題是相同的，即無視裝置的真實解析度，直接通過dpi，在物理尺寸和瀏覽器之間重設解析度，這個解析度和裝置的解析度無關。比如，你拿個3.5寸-320 * 480的iphone3 gs、3.5寸-640 * 960的iphone4或者9.7寸-1024*768的ipad2，雖然裝置的解析度不同,物理尺寸也不同，但你可以通過設定viewport讓它們在瀏覽器裡有相同的解析度。比如說，你的**是800px寬，你可以通過設定viewport的width=800，來讓你的**在這三個不同的裝置上都剛好滿屏顯示你的**。
html中的meta標籤
meta元素提供頁面的原資訊，位於文件頭部 content屬性 該屬性提供名稱 值對中的值，使用要與http equiv或name屬性一起使用 3.1 http equiv 屬性 對應的值有 content type expires refresh set cookie 該屬性把content屬性關...
Meta標籤中的Robots屬性
robots meta應該放置在網頁的什麼位置呢？跟任何一種meta標籤是一樣的，robots meta放置在html網頁 的head之內。怎麼使用robots meta標籤？例如 當content需要包含多個屬性的時候需要用英文逗號隔離，注意同種屬性正反兩個方面 例如 index與noindex ...
HTML中meta標籤的作用
首先，meta標籤是乙個自結束標籤，其格式為，下面介紹meta標籤的作用 1.規定字符集 html規定解碼字符集為utf 8，此句為了防止亂碼，utf 8字符集支援 地球上所有的文字，而中文系統預設編碼是gb2312，產生亂碼的根本原因是編碼和解碼採用的字符集不同。2.設定網頁關鍵字 其中name屬...