PREMIUM
第1回
レスポンシブコーディング入門 -MediaQueryを実装する-
2016年6月26日 60min
スライド資料
授業の概要
こんな人にオススメ
同一HTMLでデバイス毎にデザインが切り替わるサイトを作りたい方
担当の先生／パーソナリティ
チャプター
-
授業全体の内容
00:46 -
アジェンダ
00:44 -
参考授業の紹介
01:03 -
3つのシリーズのおさらい
02:58 -
レスポンシブデザインと.htaccessの違いを学ぼう
00:15 -
.htaccessで切り替わるサイト
05:32 -
Googleがレスポンシブサイトを推奨
03:28 -
振り分け用重複コンテンツのデメリット
00:38 -
レスポンシブデザインとは
00:17 -
レスポンシブで作られた巨大サイトを見てみよう
03:52 -
ブレイクポイントとは
00:12 -
cssが切り替わるポイントを確認しよう
02:59 -
Bootstrapのブレイクポイント
03:51 -
MmediaQueryを実装しよう
00:17 -
授業素材のダウンロードしよう
00:47 -
MediaQueryを実装する方法を学ぼう
00:57 -
linkタグでの設定方法を学ぼう
00:32 -
cssファイル内の設定方法を学ぼう
00:32 -
viewportの指定を学ぼう
04:33 -
レガシーブラウザへの対応を学ぼう
01:20 -
linkタグでの実装を実際に見てみよう
05:57 -
media属性を用いたcssファイル内での設定を実際に見てみよう
02:43
-
Q,レガシーブラウザでもIE11の使用率がまだ高いですが、それはどういう扱いでしょうか？こちらの対応はしなくても問題無いでしょうか？
00:55 -
cssをもう一度確認してみよう
04:46 -
Q,切り替え時の設定991px 922px で値に間があいているのはなぜだろう。
01:13 -
Q,linkタグにmediaQueryをいれる方法とcssファイルに入れる方法どちらが主流ですか？
01:14 -
Q,linkタグにmediaQueryをいれる方法とcssファイルに入れる方法どちらが主流ですか？
01:24 -
Q,一般に、どちらで、した方がいいですか？PCとスマホのCSSをlinkでする方法とCSS１枚にPC用とスマホのブレイクポイントを書く方法。サイトによると思いますが
01:08 -
Q,ブレイクポイントは指定しませんが、横幅の最低サイズは320PXまででよいでしょうか？ そこまでカラム落ちしないように作り、それ以下wrapperのdivにmin-widthで小さくならないように固定しておけばよいでしょうか？ 最大は1920pxまでの固定ですね。
01:18 -
Q,sp版とpc版のcss共通部分をメディアクエリの外に書く方法があると聞いたのですが?
01:03 -
お知らせ