演習課題「テーブルタグにBootstrapを適用する」

右の環境には、「myblog」プロジェクトに「diary」という1行掲示板が作成してあります。

この一覧ページの表組みを、Bootstrapのデザインを利用するように修正してください。表組みには、以下のスタイルを割り当てます。

table table-striped table-hover

採点して、すべてのジャッジに正解すれば、演習課題クリアです!

※ 採点時は、サーバーを起動し、問題文に関するページにアクセスできる状態にしてください。

演習課題「リンクのデザインをボタンに変える」

右の環境には、「myblog」プロジェクトに「diary」という1行掲示板が作成してあります。

この新規ページのリンクを、Bootstrapのボタンを利用するように修正してください。ボタンには、以下のスタイルを割り当てます。

btn btn-primary

採点して、すべてのジャッジに正解すれば、演習課題クリアです!

※ 採点時は、サーバーを起動し、問題文に関するページにアクセスできる状態にしてください。

※有料会員になるとこの動画をご利用いただけます
詳しい説明を読む

#04:Bootstrapでページの見栄えを整えよう

ここでは、Bootstrapを利用して掲示板アプリケーションの見栄えを整えます。Bootstrapには、テーブルタグやボタンに見栄えの良いスタイルが用意してあります。これを利用すれば、アプリケーションのデザインを簡単にレベルアップできます。