web-dev-qa-db-ja.com

携帯電話でデフォルトでウェブサイトをズームアウトする

ですから、ユーザーが私のウェブサイトで私の背景を見ることができるようにしたいと思います。現在、私のウェブサイトの幅は925pxで、モバイルブラウザ(iPhone、Opera Mini)など)でウェブサイトを表示すると、テキストが拡大され、ユーザーには表示されません。背景。

meta viewportタグを使用しようとしましたが失敗しました。モバイルブラウザでデフォルトでウェブサイトをズームアウトするにはどうすればよいですか?

編集:

これまでに試したコードは次のとおりです。

<meta name = "viewport" content = "width = device-width">
15
Kredns

私はこれが古い質問であることを知っていますが、誰か他の人が答えを必要とする場合に備えて、とにかく答えています。

2011年9月の時点で、Opera MiniはまだPrestoレンダリングエンジンのバージョン2.5を使用しています。ビューポートはPresto2.7までOperaでは利用できません。(OperaMobile 、私たちのスマートフォンブラウザしますビューポートをサポートします。)

これを試して:

<meta name="viewport" content="initial-scale=0.25">

width=device-widthを含めると、ブラウザは「魔法のように」**コンテンツ領域を見つけて、デバイスの幅に合わせて調整します。背景を覗き見させたい場合は、ビューポート内に収まるようにページ全体を縮小する必要があります。

<meta name=viewport>を完全に除外しても機能しますが、通常は背景画像が少なく表示されます。

ただし、理想的には、メディアクエリを使用して、さまざまな幅で機能するサイトを作成する必要もあります。

**ブラウザ開発者が私よりもうまく説明できるようなヒューリスティックを使用する。

19
webinista

多くの試行錯誤の末、iPhone5.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" /> 
5
Nomad77

びっくりしましたmeta viewport(Mobile Safariでは)機能しませんでした。使用したものを投稿できますか?

[〜#〜] update [〜#〜]:これは一般的に私にとってはうまくいきます...試してみてください:

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

が機能する場合は、スケール値で遊んで、ユーザーが必要に応じてズームできるようにすることができます。

1
donohoe