2011-08-16 28 views
6

携帯電話のWebページにアクセスすると(Androidを使用しています)、通常のページの場合は携帯電話の画面に収まるように縮小します。モバイルWebページを縮小するにはどうすればよいですか?

私はいつも携帯電話のページを小さくすることなく完全に電話の画面解像度に収まるようにページを小さくする方法を想定していました。

これは起こっていません。私は特に私のページサイズをbody{ width: 300px;}に設定しました。私はそれを私の電話機にロードしても、左上隅に収縮しており、周りに十分な空きスペースがあります。

私は間違っていますか?

+0

私は前にこの質問に答えました:http://stackoverflow.com/questions/2977550/iphone-safari- css-rotation-bug/3188736#3188736 –

答えて

9
あなたは、ビューポートメタタグを使用する必要が

<!doctype html> 
<html> 
<head> 
    <title>Hello world!</title> 

    <meta name="viewport" content="width=device-width"/> 
</head> 

<body> 

<p>Hello world!</p> 

</body> 
</html> 

詳しく読むここhttp://davidbcalhoun.com/2010/viewport-metatag

+0

ありがとうございました! :) –

+0

良い答えですが、それでも実際のサイズでWebページは表示されません。ウェブページ上の1ピクセルは実際にはモバイル画面上で1.5ピクセルです。 – trusktr

0

これは、本体の幅がブラウジングデバイスとの関係にあるためです。

最近の携帯電話のほとんどはデスクトップブラウザをシミュレートしているため、ブラウザウィンドウ全体に対して300pxの幅が300pxです。基本的には、デスクトップブラウザと同じように、電話機のブラウザと同じように表示されます。

モバイルユーザーに少し違うものを表示することが理想的です。通常は、メニュー項目が大きく、必要のない通常のコンテンツのほとんどを隠すページの縮小版です。 (派手なヘッダーなど)。

関連する問題