ミニチュアハウスをつくる!

プロによるミニチュアハウス製作ブログ-1/87-1/160サイズ-

hpその2

本日は、晴れて蒸し暑い感じ。。。

世間では、気象病が流行っているとか何とか。。。

自分的には近年、気象がおかしい感じがしている。

体力が衰弱している場合、無理は禁物かもしれん。。。

レスポンシブWeb

レスポンシブを勉強するために、コツコツ作ってきたHPの概要がひとまず完成。

本式採用するものでもないけど、結構いい感じに出来たなぁっとチョット自己満足な感じに。。。

ブラウザの縁をマウスでドラッグして大きくしたり小さくしたりすると、メディアクエリでセットした状態に面白いように変形。。。

実際のところ、自分が思うように変形させるのは、結構難しかった。。。

いろいろ複雑に絡み合うので、CSS慣れしていない私には楽ではなかったが、何とか思った形状に変形させることがデケタ。

次は、もう少し深く突っ込んだ作業をしてみようかと。。。まだ、先は長いなぁ。。。。

下記はスマホサイズのイメージだが、上部のメニューは、ありがちな横3本線のアイコン式にして、アイコンタップしたときにメニューが出るほうが、イイかも知れないのだが、自分的にはあまりパットした感じがしない。。。どうするか???

f:id:lis2016zz:20170623203814p:plain

次に横にブラウザをドラッグして広げタブレットサイズへ。メニューを上部へ横へ配置するように変形~。

f:id:lis2016zz:20170623203829p:plain

PCサイズまでドラッグするとぐ~~っと面積が広がるので、どうするか?ッて感じになった。。。まあ、本チャンではもっとメニューとか内容が増えるのでどっちかというとスマホサイズでどうコンテンツ群を入れ込むか?が問題になりそうではあるな。。。

f:id:lis2016zz:20170623203849p:plain

とりあえず、勉強のためのWebページなので内容はテキトウですのであしからず。。。

 

ペンケム模型作品(Instagram)
PenkeM作品集

 

にほんブログ村 ハンドメイドブログ ミニチュアドールハウスへ にほんブログ村 鉄道ブログ 鉄道模型へ にほんブログ村 鉄道ブログ 鉄道模型 レイアウト製作(ストラクチャー)へ

広告を非表示にする