演習課題「投稿フォームにBootstrapを適用」
右のbbs.phpは、投稿フォームにBootstrapを適用している途中の状態です。
フォームの「投稿者」のところに、次のようにBootstrapのクラスを適用してください。
- 2つ目の「div」タグの「class」属性を「form-group」にする
- 「label」タグの「class」属性を「control-label」にする
- 「input」タグの「class」属性を「form-control」にする
採点して、すべてのジャッジに正解すれば、演習課題クリアです!
演習課題「発言リストにBootstrapを適用」
右のbbs.phpは、発言リストにBootstrapを適用している途中の状態です。
この発言リストに、次のようにBootstrapのクラスを適用してください。
- 「table」タグの「class」属性を「table table-striped」にする
- 「button」タグの「class」属性を「btn btn-danger」にする
採点して、すべてのジャッジに正解すれば、演習課題クリアです!
※有料会員になるとこの動画をご利用いただけます
詳しい説明を読む
#10:Bootstrapで見た目を整えよう
ここでは、掲示板の見た目を整えます。そのために、HTMLフレームワークのBootstrapを使って、投稿フォームとテーブルのデザインを変更してみましょう。
このチャプターで作成した、bbs.phpのコードです。
- https://paiza-webapp.s3.amazonaws.com/files/learning/webapp_php_sql/bbs_chap10.php
- デザイン知識がなくてもOK!Bootstrapの使い方【入門者向け】 | TechAcademyマガジン
http://techacademy.jp/magazine/6270