CSS3 レスポンシブデザイン ブレークポイントでデザインの変更をアニメーションする - プログラミングや副業・フリーランスに関する情報Webサイトのレスポンシブ化が当たり前になってきました。 今回は、ブレークポイントでCSSの切り替えをアニメーションする方法の解説です。 レスポンシブデザインとは？レスポンシブデザインとは、画面サイズの異なる端末（PC、タブレット、スマートフォンなど）でサイトを閲覧した際、それぞれの画面サイズに最適なデザインで表示するためコーディングを行ったデザインのことです。 レスポンシブデザインはGoogleも推奨しているため、現状SEO的にも優位になります。 ブレークポイントとは？ブレークポイントとはレスポンシブデザインをする上で、デザインが切り替わる画面サイズを決めておくことです。 スマートフォンでのデザインは〜576pxまでタブレットは577px〜992pxまでといった設定を行います。 CSSのフレームワークであるBootStrapでの現状の設定は下記のようになっています。 ブレークポイントサイ
