この特設ページについて

CPIスタッフブログではWeb制作にお役立ちする情報を掲載しています。
その中でもBootstrapの記事はCPIスタッフブログの中でも多く紹介させていただきました。記事が多くなりましたので特設コーナーにてBootstrapの記事だけをまとめました。

Bootstrapとは

BootstrapとはTwitter社が提供する、レスポンシブウェブサイトを構築するためのCSSフレームワークです。
あらかじめ用意されたスタイルを適用するだけで、見栄えの良いサイトを素早く構築することができます。

ライセンスは、ソースコードの改変、再配布、商用利用も可能です。

Bootstrapの基本 ( Hello World )

では、さっそくBootstrapを使い、Hello Worldを表示します。

  1. Bootstrapのページにアクセスし、メニューから「Getting started」をクリックします。
  2. ダウンロードBootstrapをクリックします。
  3. Bootstrapのzipファイル(圧縮ファイル)がダウンロードできるので、デスクトップなどに解凍してください。
  4. 解凍をした、「cssフォルダ」「fontsフォルダ」「jsフォルダ」の3つのフォルダを使います。
  5. 次にベーシックテンプレートをコピーします。
    下記のページにアクセスし、ソースコードをコピーしてください。
    http://getbootstrap.com/getting-started/#template
  6. 手順「4」で解凍したフォルダに、「index.html」を作成し、コピーしたソースコードを保存してください。
    フォルダ階層

基本はこちらのベーシックテンプレートを使い、Bootstrapの使い方の説明を行っていきます。

 
このエントリーをはてなブックマークに追加
Author ( この記事を書いた人 )

阿部 正幸

KDDIウェブコミュニケーションズ
クラウドホスティング事業本部 エバンジェリスト

CPIスタッフブログ編集長。ACE01,SmartReleaseをリリース後、現職の「エバンジェリスト」として、web制作に関する様々なイベントに登場