ASP.NET MVC4でBootstrap Ver3を使ってみた。
Ver2を使った例はかなりあって、参考にしてたらはまった・・・。
Ver3とVer2で記載方法がかなり違ってて・・・。
Ver3はこっち。
Ver2はこっち。
ご注意ください!!
以下ASP.NET MVC4(VS2012)でBootstrap Ver3を使用する方法です。
以下やってみた感想です。 総じて課題はあるものの、
一つの選択肢として覚えておいて損はないと思いました。
Ver2を使った例はかなりあって、参考にしてたらはまった・・・。
Ver3とVer2で記載方法がかなり違ってて・・・。
Ver3はこっち。
Ver2はこっち。
ご注意ください!!
以下ASP.NET MVC4(VS2012)でBootstrap Ver3を使用する方法です。
- まずは何はともあれ、MVC4のプロジェクトを作成します。
- 新しいプロジェクトから、”ASP.NET MVC 4 Web アプリケーション”を選択します。
- デフォルトの設定でOK押します。Razor推します!
- NuGetからBootstrapVer3をインストールします。
- プロジェクト→NuGetパッケージの管理を選択します。
- オンライン(左上)を選択して、検索テキストボックス(右上)に”bootstrap”入れて検索しします。すると”Bootstrap”が表示されるので、バージョンと依存関係(前提)を確認し、インストールボタン(真ん中)を押します。
- 正常にインストールされると、緑丸チェックが表示されます。
- ソリューションエクスプローラーから、インストールされていることの確認。
- Content/bootstrap配下にcssがあること。
- Content/fonts配下に各ファイルがあること。
- Script配下にjsがあること。
- cshtmlを変更します。
- 変更前のIndex.cshtmlの画面です。
- 修正対象は以下3つ。(Codeは長いので、ファイルダウンロードにしました。)
- Views/Home配下のIndex.cshtml
- Views/Shared配下の_Layout.cshtml
- Views/Shared配下の_LoginPartial.cshtml
- 変更後のIndex.cshtmlの画面です。
以下やってみた感想です。 総じて課題はあるものの、
一つの選択肢として覚えておいて損はないと思いました。
- わかっていれば簡単に適用できる。わかってないと結構めんどい。
- 今っぽいWEBサイトが簡単に作れる。
- Viewsフォルダは以下のファイルだけ修正すれば良い。さすがMVC。
- 日本語フォントがいまいちな気がする。
- 全体的なテーマをざくっと変えたい。
- bodyタグの中とか、bundleとか、まだ修正すべきところは多い。
- うーん、おもしろい。
コメント
コメントを投稿