F

2016/04/23

レスポンシブデザイン


アイドルマスターシンデレラガールズスターライトステージのSSR一覧(2016/4/23現在)。
どこが強いのか一目瞭然です。
来たるSSR周子はダンスかビジュアルか……。鷺沢も欲しいなあ。


↑レスポンシブデザイン(グリッドシステム)のイメージ図です。
http://websae.net/twitter-bootstrap-grid-system-21060224/より引用させていただきました。

ブラウザのウィンドウサイズを拡大/縮小すると、それに合わせてウェブページのサイズ(≒レイアウト)も変化するという機能です。
bootstrapというhtml/cssのフレームワークが有名らしく、初めはそちらを使って当ブログもレスポンシブデザインを導入しようかと思っていたのですが、よく分からなかったので別のhtml記述を利用しました。

利用しようと思ったのですが、別にこんなん要らねえだろと思ったので終わりです。
一応以下にメモっておきます。
参考URL→http://blogger.weblix.net/2012/06/blogger-responsive-web-design.html
<b:include data='blog' name='all-head-content'/>
<meta name='viewport' content='width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0'/>
<link type='text/css' rel='stylesheet' media='screen and (max-width: 1000px)' href='http://www.blogger.com/static/v1/widgets/3511694692-widget_css_mobile_bundle.css' />
bloggerの場合は、これをhtml内に記述するだけでレスポンシブデザインが適用されます。赤字は適宜調整。
ワードプレスなんかだとデフォルトでこの機能が付いてるテンプレートもあるみたいですね。アタマヨス。

オワリマス。

0 件のコメント:

コメントを投稿