// #twinkleTemplate ?>
// #twinkleTemplate ?>
授業で使用する教材
教材はありません
「授業フィードバック」で、授業の感想を教えてください!
チュートリアルは、こちらの「その他のオプション」からいつでも確認いただけます。
ここには授業中のやりとりが表示されます
レスポンシブデザインとはPC、スマートフォン、タブレットなど デバイスごとに異なるデザインを 同一htmlファイルで実現するマルチデバイス対応技術です。
授業中には、実際にデバイスごとにデザインを変える、 メディアクエリーというcssの技術を用いて レスポンシブデザインのページを完成させます!
1) 解像度とデバイスサイズの関係
2) 基本は可変幅のフレキシブルデザイン
3) フルードイメージ、フルードグリット
4) 条件付コメントを記述してIE8、IF7に対応させる
5) ヴューポートの指定
6) スマホエミュレーターで見てみよう
1)Sublimeと解凍ツールのインストール
手順はこちらのページ参照。→http://schoo.jp/teacher/315
2)授業中ブラウザの開発ツールを使用します。
このページのスライドp30~34参照
3)エミュレーターのインストール(win・Mac共通)
まずAdobe Airをインストールします。
http://get.adobe.com/jp/air/
つづいてMobilizerをインストールします。
http://www.springbox.com/mobilizer/
教室画面の機能をご紹介します
学習機能を活用して、効率よく学習しましょう!