CSSで異なる画面解像度を扱うにはどうすればいいですか？

Question

私はUIデザインが初めてです。いろいろなHTML要素を配置するときに、異なる画面解像度を扱う最良の方法は何か疑問に思っていましたか？ 私は％年齢を使用すると前進すると思っていましたが、それはそうではないことが判明しました！

Answer 1

、@mediaクエリの中で最も興味があると思います。これは、ユーザーがブラウザのサイズに基づいて拡張または縮小したWebページを扱う -

http://www.maxdesign.com.au/articles/liquid/

http://www.alistapart.com/articles/negativemargins/

Answer 2

％が正しい方法です。 Javascriptを使用して解像度を検出し、そのコードに基づいてデザインを調整すると、コードは非常に素早くおいしい肉のスパゲッティに変わります。

私はいつも最低解像度800x600でデザインするように言われましたが、今日は常に最低解像度として1024x768で行っています。

デザインについて詳しく説明していない限り、私は本当に助けてくれません。私は恐れています！

Answer 3

check 960gridは、最も一般的な画面解像度で割り切れるレイアウト標準です。

Answer 4

はここに読みました：http://www.smashingmagazine.com/2011/01/12/guidelines-for-responsive-web-design/

をあなたが液体のレイアウトを見てみる必要があり、特にmax-widthとmin-device-width

Answer 5

まず、これはあなたのために働くかどうかを確認します。 このタグであなたのタグを置き換えてください

今の場合、このオンロードを実装するよりも、これはあなたの頭痛の100％を削減し、外観を損傷することなく、1366×768枚の画面で、ラップトップのためのクイックハックを行います以降、大きく、より良い画面

var screenHeight = screen.height; 
if (screenHeight < 800) { 
    $('body').css('zoom', 0.8); 
} else { 
    $('body').css('zoom', 1); 
}