@media

 メディアクエリの1つです。条件付きでスタイルを摘要できます。

 プリンタやディスプレイなどのデバイスや、デバイスやブラウザなどの特性に応じてスタイルを変更したいときに利用できます。
 @mediaによって、サイトをPCでみる場合とモバイル端末で見る場合によってスタイル設定を変えることができます。

 メディアクエリは入れ子にすることができます。

表示される横幅のよるスタイル変更

 

 表示するデバイスごとにスタイルを変更するには、@importでデバイスごとのスタイルシートを読み込む方が便利です。

@import url("./mobile.css") screen and (min-width:0px) and ( max-width:768px);

@import url("./pad.css") screen and (min-width:768px) and ( max-width:1024px);

@import url("./normal.css") screen and (min-width:1024px);