Divメディアクエリの表示/非表示

Question

特定のdiv表示をモバイルの幅でのみ行うにはどのようなコードを使用できますか？

私は画面の上部に100％幅のフル・ディビジョンを持っていますが、デバイスがモバイル幅として指定されている場合にのみ表示したいと考えています。

Answer 1

「モバイルの幅」という意味はわかりません。しかし、それぞれの場合、CSS @mediaは、スクリーン幅単位で要素を隠すために使用できます。

<div id="my-content"></div> 

...と：：いくつかの例を参照してください

@media screen and (min-width: 0px) and (max-width: 400px) { 
    #my-content { display: block; } /* show it on small screens */ 
} 

@media screen and (min-width: 401px) and (max-width: 1024px) { 
    #my-content { display: none; } /* hide it elsewhere */ 
} 

いくつかの真のモバイル検出が難しいプログラミングとかなり難しいの一種です。最終的に：http://detectmobilebrowsers.com/または他の同様の情報源を参照してください。

Answer 2

デバイスのビューポートにアクセスしたがっているようです。ヘッダーにこのメタタグを挿入することでこれを行うことができます。

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

http://www.w3schools.com/css/css_rwd_viewport.asp