Info kplace.plala.jpから移設しました

■目的
 WebページをResponsive/スマホ対応でリニューアルします。
 使用するのはBootstrapフレームワークです。

■Bootstrap
 ナビバーやボタンをはじめとしてCSSの枠組みやスタイルを部品として提供します。
 CSSの作成を省略できデフォルトでレスポンシブデザインとなり統一デザインのページが容易です。
 準備されたBootstrapのパーツをhtmlに貼り付けて利用します。
bootstrap site
 Bootstrapのサイトはこちら

■Bootswatch
 BootswatchはBootstrap用のテーマを無償で提供します。
 背景やボタンの配色テーマを変更できます。
bootswatch
 Bootswatchのサイトはこちら

■サイトイメージ
 コンテンツの配置をレスポンシブ構成になるように再配置します。
cbreeze

■参考ページ
 「Bootstrap/Webページ作成」のページはこちら
 「Bootstrap/Gridシステム」のページはこちら

■結果
 レスポンシブ対応にサイトイメージを再配置してみました。
 あとはBootstrapのGridシステムに展開しパーツを張り付してhtmlを生成します。
 これだけでレスポンシブでスマホ対応のページが作成されます。 

  blog      MovableType