カエレバのカスタマイズも最後になりました。最後はレスポンシブ対応です。スマホやタブレット端末でサイトを見る人も多い今、レスポンシブ対応は必須です。それでは始めていきましょう。CSSだけコピーしたい方はこちら
Contents
スマホ時代に!カエレバもレスポンシブ対応
キヤノン 2015-04-17
まずは条件分岐です。7インチタブレットのブラウザサイズが600pxということなので、それ未満の場合に表示が変更されるようにします。
カエレバ内のテキストを中央寄せにします。
画像の左寄せを解除します。
ボタンを大きくして縦に並べます。
簡単にできましたね。
今日のまとめ
パソコンで見ている人もブラウザの幅を狭めればスマホと同じ表示になるので試してみてください。最後に全3回のCSSのまとめをおいておきます。