初心者どんとこい!bootstrapだと簡単にサイトを作成できるんです。

webサイトをbootstrapで作成している企業や個人のかたは多いです。
chromeの拡張機能で確認すると「あ、bootstrap使ってる。」「あ、ここもbootstrap使ってる。」と感じます。
実際自分が勤めている会社でもbootstrapを使ってサイトを作成しているので、
今さら感はありますが、bootstrapを使ってwebサイトを作ってみました。
※詳しい用語説明は省いています。用語の意味を知りたいときは、Google先生に質問しましょう。

スポンサーリンク
スポンサーリンク




bootstrapって何?

bootstrapとは、CSSフレームワークの一つです。
特徴は画面サイズによって、ヘッダーや記事の部分をいい感じに配置されることですね。
自分で一から記述しなくてもいいというのは、本当にありがたいです。

●bootstrap公式サイト
http://getbootstrap.com/

準備をしよう

作業は2つです。

①公式サイトからファイルをダウンロードします。
②トップページ「index.html」を作成します。

①公式サイトからファイルをダウンロードする
1.bootstrap公式サイトにアクセスします。
2.「Getting start」画面の「Download Bootstrap」ボタンをクリックしてファイルをダウンロードします。※任意の作業フォルダに保存します。
Getting started3.ダウンロードしたファイルを解凍します。
4.解凍したフォルダに任意の名前を付けます。

②トップページ「index.html」を作成する
1.「Getting start」画面の「Basic template」内容をテキストエディタにコピペします。
2.ファイル名は「index.html」と入力し、4のフォルダ直下に保存します。

これで準備は整いました。

こんなサイトが作れるよ

あとはbootstrapの公式サイトの「CSS」「Components」「JavaScript」を参考に、
コピペ→文字を入力→コピペ→文字を入力・・・・で出来上がります。
例えばこんな感じのサイトを作れます↓※画像をクリックするとサイトへ移動します。
デモサイト

webサイト作成の知識はかなり忘れていたのですが、それでも↑みたいなサイトが作れます。
作ってみて時間がかかったのは、どんなコンテンツのあるサイトを作成するか考えたときです。
構想を考えてしまえば、ひたすらコピペ&文字入力でした。

利用してみて簡単にサイトを作れること実感しました。

スポンサーリンク
スポンサーリンク




シェアする

フォローする

スポンサーリンク
スポンサーリンク