1

たとえば、ブラウザーのサイズを変更するときや、800X600 以上などのデスクトップ ブラウザー サイズ用に設計されたレイアウトを表示するときなど、さまざまな画面サイズでコーディングできる Web サイトを構築するためのベスト プラクティスは何ですか。私はどちらかというとバックエンド開発者ですが、jquery モバイルを使用する Web アプリケーションを構築する必要があります。デスクトップのレイアウトも変更したいだけです。これまでのところ、私はメディアの種類しか認識していません。フレームワークのようなより良い解決策はありますか。ありがとう

4

2 に答える 2

1

ドキュメントの頭にこれらが必要です：

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />

これらは標準のメディアクエリです

/* #MEDIA QUERIES
================================================== */

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    body {min-width: 768px; } /* example */
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
    body {min-width: 320px; } /* example */
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    body {min-width: 420px; } /* example */
}

頑張ってください！私のサイトをチェックして、それがどのように機能するかを確認してください: www.santz.net

于 2013-05-20T23:25:42.733 に答える
1

css でクライアント側のメディアクエリを使用して、動作を指定できます。

@media-query(min-width:320px) { .do_not_show_on_small { display:none}

}

MDN メディア クエリ情報

またはサーバーバックエンドを使用してユーザーエージェントを見て、別のhtmlを送り返します...

http://www.whatsmyuseragent.com/

次に、次のようなサーバー ロジックの例を示します。

if (ff8) then
   send (browser_html.html)
else if (android os)
   sned (mobile_html.html)

(もちろん、これはテンプレート エンジンを使用した同じデータの異なるテンプレートである可能性があります)。

于 2013-05-20T22:28:23.093 に答える