6

私はサイトで作業していますが、モバイルフレンドリーバージョンも必要です。私はこれの初心者です。

誰かが私が次のコードを使うべきだと提案しました、それに対して私はここで多くの関連する質問を見つけることができません：

<meta name="viewport" content="width=320, initial-scale=1">

問題は、それをどのように実装するかがわからないことです。それでは、ページ全体を単純に変換することはできません。

私が要求しているのは、私が自分の目標を達成する方法についてのいくつかの指針です。

4

3 に答える 3

8

http://dev.opera.com/articles/view/an-introduction-to-meta-viewport-and-viewport/は、ビューポートメタタグのさまざまな側面の概要を示しています。さまざまな画面サイズで最適化するには<meta name="viewport" content="width=device-width">、メディアクエリと組み合わせて使用​​することをお勧めします（上記の記事でも説明されています）。

リンクしたElementFusionチュートリアルでは、ビューポート値の間にコンマではなくセミコロン区切り文字を使用していることに注意してください。これは正しくありません。最初の例のように、必ずコンマを使用してください:-)

于 2011-06-12T23:54:01.127 に答える
4

ビューポートに関する投稿はほとんどありません。ヘッドタグの間に置くだけです。 http://www.quirksmode.org/mobile/viewports2.htmlは、より良いアイデアを提供する可能性があります。ビューポートと一緒にモバイルDoctypeを使用することを忘れないでください。

例えば

   <?xml version="1.0" encoding="utf-8"?>
   <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml">
   <head>
   <meta name="viewport" content="user-scalable=yes, initial-scale=1.0, maximum-scale=2.0, width=device-width" />
   </head>
   <body>
   </body>
   </html>
于 2011-06-10T07:39:58.313 に答える
1

私はiWeb2011をすべての古い構成で使用しており、もちろん相対幅は700pxです。

これは何も変更せずにすべてのデバイスで機能することがわかりました。

<meta name="viewport content="width=700=content=width-device-width, initial-scale=1.0" />

これは私のウェブサイトです：

http://theevolutionofreason.com/The_Evolution_Of_Reason.html

リサイザーアプリで試してみてください。または、Googleのビューポートリサイザーアプリをダウンロードします。（無料）、すべてのデバイスとの視覚的な互換性を示すため

https://chrome.google.com/webstore/detail/viewport-resizer/kapnjjcfcncngkadhpmijlkblpibdcgm

また、私のウェブサイトの「要素ソース」もチェックしてください。

訪問：アップルサポートコミュニティディスカッション「iWebビューポート設定」 https://discussions.apple.com/message/29393840?ac_cid=op123456#29393840

于 2015-11-29T13:41:53.300 に答える