日別アーカイブ: 2012年12月18日

Responsive Web Designとは?

12月15日(土)の活動報告・改訂版です。

はじめに

mq1ファイルをダウンロード

mq2ファイルをダウンロード

ファイルをダウンロード出来ましたら、mq1とmq2それぞれをブラウザで開いて下さい。
開きましたら、それぞれの画面の幅を小さくしてみて下さい。
いかがでしょうか?
mq2の方はある大きさまで狭まると、レイアウトが変わります。

今回の授業では、mq1を元に、
画面の大きさによってレイアウトが変わるmq2を作成しました。

それでは、どうやって作るのか?を説明してまいります。
元ファイルであるmq1のソースをコピーしてテキストエディタで開き、動作を確認してみて下さい。

手を加えるのは<head>内の<style></style>の中とhtmlの一部です。
続きを読む