CSSフレームワークであるBootstrapを初めて使ってみたので、そのBootstrapについて、ご紹介を。 フレームワークは初めて使ってみたのですが、便利であったため、PHPのフレームワークのCakePHPなどに手を出してみたいと思いました。

1. 掲示板にBootstrap使ったよ！

2. 自己紹介
 趣味：
バドミントン、アニメ鑑賞(大学2年からアニメの
世界へ)、
洋楽を聞くこと
 言語：
C,JavaScript,PHP,Java
@teradotomohiro

3.  今まで作ったもの：
ポ○モンのバトルシーン
(C)
家計簿
(PHP,MySQL)
掲示板(new!)
(PHP,JavaScript,MySQL)

4. 今回は、
CSSフレームワーク？
について話すよん
ʅ(´◔౪◔)ʃ

5. CSSフレームワーク！
CSSが分からない。
デザインとかむりぽ。
でも見た目はよくしたい！！って方
に！
CSSフレームワークをどうぞ(‘､3_ヽ)＿

6. CSSフレームワークとは？
 フレームワーク
●開発・運用・意思決定を行う際に、その基礎とな
る規則・構造・アイデア・思想などの集合のこと。
(wikiより)
CSSフレームワークの場合は、簡単にかっちょいい
デザインを利用できる便利なもの？

7. CSSフレームワークの種類
・Boostrap
・Foundation
・Pure
・Gumby

8. Boostrapを掲示板に利用
 Boostrapなし
何だ！この作ってて萎える表示は！！
※掲示板出来てからBootstrapなしバージョンを作ったので
雑＾；

9.  Boostrapあり
Bootstrap使うとさっきと違いが歴然！！

10. Bootstrapを使ってみる。
 Button
<input type=“button” value=“Hello” class=“btn btn-primary”>

11.  Panel
<div class="panel panel-primary">
<div class="panel-heading">
お知らせ
</div>
<div class="panel-body">
こんにちは
</div>
</div>

12.  Navbar
<div class=“nav navbar-inverse”>
<ul class=“nav navbar-nav”>
<li><a href=“#”>Link1</a></li>
<li><a href=“#”>Link2</a></li>
<li><a href=“#”>Link3</a></li>
</ul>
</div>

13.  Navbar
これやで！！これ！

14. その他
・Blockquotes
・Tables
・Forms
・Tabs
・Pagination etc...
詳しくは・・・
http://bootswatch.com/flatly/#

15. まとめ
 CSSフレームワークは結構便利
 下手なCSS書くよりうまいデザインが出来る
 作業時間の短縮

16. 余談？頑張ったこと
 クエリ(DataBaseへの命令)頑張った！
 $sql = “SELECT bbs.id,bbs.userid,bbs.text,bbs.date,registration.name FROM bbs INNER JOIN registration ON
bbs.userid = registration.userid WHERE bbs.id = :bbs_id UNION
SELECT bbs_comment.id,bbs_comment.userid,bbs_comment.text,bbs_comment.date,registration.name
FROM bbs_comment
INNER JOIN registration ON bbs_comment.userid = registration.userid WHERE bbs_comment.bbs_id
= :bbs_id";
 作った掲示板の動作を見てやってください(´・ω・｀)
動作が最後です(‘､3_ヽ)
＿

17. ご清聴ありがとうございました。