景観デザインを目指せ

重山陽一郎の個人ブログ blog.enviro-studio.net
<< 藤倉ダム | HOME | ブログのフォントをWebフォントにしてみた >>
ブログを「レスポンシブ・ウェブデザイン」にしてみた
IMG_0065
このブログを、「レスポンシブ・ウェブデザイン」にしてみました。iPadやパソコンで見る時には、上の画像のように、これまでと同様の見え方なんですが....
 
IMG_5185
スマホで見る時は、サイドコラムが隠れてメインコラムが画面いっぱいに表示されます。

IMG_5186
スマホを横にすると、再びサイドコラムが現れます(^^)

IMG_5183
このブログは、JUGEMのシステムを使っています。JUGEMにはスマホ用のレイアウトがあらかじめ用意されていているものの、上の画像のようにブログ内の写真の幅が強制的に280pxになってしまうのです。写真を良く使う私のブログでは、ちょっと困る。
JUGEMではパソコン用レイアウトは、HTMLやCSSを自分で変更できます(スマホ用はできない)。それで、パソコン用の表示を、スマホでも対応できる"Responsive Web Design"に変更したわけです。

スマホで閲覧した時には、自動的にスマホ用レイアウトに行ってしまうので、そこから強制的にパソコン用レイアウトに移す必要がありますが、その仕組みはこちらとこちらのホームページを参考にさせていただきました。有り難うございました。

Category:MacときどきWin
SEARCH
FEED
FEATURE ARTICLE
CATEGORIES
CALENDAR
S M T W T F S
 123456
78910111213
14151617181920
21222324252627
28293031   
<< May 2017 >>
LINKS
ARCHIVES