media queryのテスト

背景色と文字色がウィンドウ幅600pxを境に変化します。Firefoxの「ツール/Web開発/レスポンシブデザインビュー」などで確認しましょう。

/*背景色は青*/
body{
	background:blue;
	-webkit-transition:1s;
	-moz-transition:1s;
	transition:1s;
}
/*600px以下で背景色は赤*/
@media screen and (max-width: 600px) {
	body { background:red; }
}
/*600px以上で文字色は白*/
@media screen and (min-width: 600px) {
	body { color:white; }
}