下記英語ビデオ、めっちゃわかりやすかったので共有します。
英語苦手な方でも動く画面やコードを見ればレスポンシブの本質が20分で理解できます。
https://www.youtube.com/watch?v=BIz02qY5BRA
*レスポンシブとはそもそも何なのか?
=> 画面サイズに反応してサイトのレイアウトが自動で変わる仕組み(反応=respond)
=> divタグごとに画面サイズの条件付きCSSを設定する
*メディアクエリの仕組み
例)
<link rel = "stylesheet" href="css/responsive.css" media="screen and (max-width: 900px)"
*ビューポートの仕組み
この様なチュートリアルビデオを作ると自分自身勉強になるので、
いつかトライしたいと思います。