質問: 楽天gold でレスポンシブデザインにしたい 楽天gold を利用しています。pcトップページ(index.html) のみ楽天gold にしていますが、これをcss を使ってレスポンシブデザインにすることは可能でしょうか?よろしくお願いいたします。
回答: ecマスターズの田中です。> pcトップページ(index.html) のみ楽天gold にしていますが、これをcss を使ってレスポンシブデザインにすることは可能でしょうか?細かい調整は必要ですが、可能です。index.htmlを確認したところ、ヘッダー・フッター・レフトナビ・ページ内容にそれぞれiframeで別のページを埋め込んで作成されていることがわかりました。まずは、読み込んでいる各htmlで、スマートフォンで観た時にどのような横幅で表示するかを指定する必要がございます。指定は タグで行うのですが、たとえば、スマホでは要素を全て縦並びにして表示する場合は、全てのhtmlファイルの、〜の中にとご記載ください。次に、全てのhtmlファイルにて、表示する横幅ごとに適用させたいスタイルシートをメディアクエリを利用してご指定ください。メディアクエリを利用すると、表示する横幅が◯◯px〜◯◯pxの場合はこのスタイルシートを適用させる、という形式で指定することができます。https://techacademy.jp/magazine/9369