css - サイズ変更の変数として画面幅を取得する

Question

単純な if ステートメントの変数として画面幅を取得したい。基本的に、画面が > 768 の場合、通常の Web サイトが表示されます。768 未満の場合は、よりコンパクトなバージョンが表示されます。これは、iPad の解像度を少し修正するだけです。情報を取得したら Web ページを更新する方法は既に知っていますが、そもそも値を取得するにはどうすればよいですか?

Answer 1

JavaScriptを使用してください..というプロパティがあります

.screenwidth()

ここにリンクがあります：

http://www.w3schools.com/jsref/prop_screen_width.asp

Answer 2

CSS3 メディアクエリが必要です

http://www.w3.org/TR/css3-mediaqueries/

http://webdesignerwall.com/tutorials/css3-media-queries

/* Any CSS for bigger screens / default CSS goes outside the brackets */

div {
    /*here*/ 
}

p {
    /*or here*/
}

@media screen and (max-width: 768px) {

   /*css specific to small screens under 768px width here*/

   div {
       /*here*/ 
   }

   p {
       /*or here*/
   }


}