レスポンシブWebデザインメディアクエリを使ってCSSを切り替えるメディアクエリとは、CSS3から使えるようになった機能の1つで、画面サイズやブラウザの表示領域に応じて、適用させるスタイルシートを切り替えることができます。これによりパソコンやスマートフォンなどユーザーの閲覧環境に合わせたデザイン設計をCSSで行うことができます。link要素でCSSを切り替えるHTMLのlink要素を利用してCSSを使い分ける方法があります。PCとスマホでスタイルシートを使い分けたい場合には、以下のような指定をします。800px)">ブラウザの表示領域が799px以下の場合は「mobile.css」が適用され、800px以上の場合は「pc.css」が適用されるという指定になります。表示領域によって使用するCSSファイルを完全に使い分けたいときに利用したりします。CSS内部に指定して切り替えるスタイルシートを使って条件に合わせて切り替える方法もあります。こちらの方法は1つのCSSファイル内にすべてのスタイルを記述していくため、閲覧環境ごとにCSSファイルを分けたりしません。{表示領域が768px以上の場合に適用されるスタイルを記述}このようにブレークポイントと呼ばれる基準値を利用して、表示領域に合わせて適用させるスタイルを切り替えていきます。「max-width」は〇〇px以下、「min-width」は〇〇px以上の指定となります。これを組み合わせて「〇〇px以上□□px以下」といった複数の指定もすることができます。{表示領域が600px以上959px以下の場合に適用されるスタイルを記述}この場合は、600~959pxの表示領域に限ってスタイルを適用させることができます。細かく区切って指定をすることもできますが、あまり細かく指定し過ぎてしまうと、かえってスタイルシートを管理するのに大変になることもあるので、状況に合わせてブレークポイントを見極めて使うと良いでしょう。