所以我希望用戶能夠在我的網站上看到我的背景。目前,我的網站寬度爲,當您在移動瀏覽器(例如iPhone,Opera Mini)中查看網站時,它會放大文字,並且用戶看不到背景。如何讓我的網站在手機上默認縮小?
我試過使用meta viewport
標記失敗。如何讓我的網站在移動瀏覽器上默認縮小?
編輯:
這是到目前爲止,我已經試過代碼:
<meta name = "viewport" content = "width = device-width">
所以我希望用戶能夠在我的網站上看到我的背景。目前,我的網站寬度爲,當您在移動瀏覽器(例如iPhone,Opera Mini)中查看網站時,它會放大文字,並且用戶看不到背景。如何讓我的網站在手機上默認縮小?
我試過使用meta viewport
標記失敗。如何讓我的網站在移動瀏覽器上默認縮小?
編輯:
這是到目前爲止,我已經試過代碼:
<meta name = "viewport" content = "width = device-width">
我知道這是一個老問題,但無論如何我都會回答,以防其他人需要答案。
截至2011年9月,Opera Mini仍在使用Presto渲染引擎2.5版本。在Presto 2.7之前,視口在Opera中不可用。 (Opera移動,我們的智能手機瀏覽器確實支持視窗)
試試這個:
<meta name="viewport" content="initial-scale=0.25">
當你包括width=device-width
,瀏覽器「神奇」 **找到的內容區域,並調整它來填充設備的寬度。如果您希望通過背景進行瀏覽,則需要縮小整個頁面以適合視口。
離開<meta name=viewport>
完全可以工作,但你通常會看到較少的背景圖像。
但是,理想情況下,您還應該使用媒體查詢來創建適用於各種寬度的網站。
**使用某種瀏覽器開發人員能夠比我更好地解釋的啓發式。
我很驚訝meta viewport
沒有爲你工作(在移動Safari瀏覽器)。你可以發佈你使用的?
UPDATE:這一般適用於我......試試看:
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0" />
如果這樣的作品,那麼你就可以開始與刻度值播放,讓用戶放大,如果他們想以及多少。
經過多次試驗和錯誤,我得到以下在iPhone 5.0.1和Android 2.3.6上正常工作。該網站的設計寬度爲480。根據您網站的寬度,您必須使用iPhone的寬度值。
<meta name="viewport" content="width=520, target-densitydpi=high-dpi" />
<meta http-equiv="Content-Type" content="application/vnd.wap.xhtml+xml; charset=utf-8" />
<meta name="HandheldFriendly" content="true" />
<meta name="apple-mobile-web-app-capable" content="yes" />
我不得不把更大的寬度(1300),使其工作。 +1因爲我很絕望。 – 2014-02-20 15:20:57
這讓我感到非常緊張。感謝這個雖然很大的幫助 – locrizak 2011-10-25 19:30:52