close

最近常看見很多部落格在討論 Bootstrap,適用了一下的確不錯,這是一個前端的 Frnamework,對於一位 Web 開發工程師,不是很懂頁面設計的確很有幫助,只要稍微了解 CSS,且在官網也提供很多不同設計範例,對寫 Code 的工程師就能把重心放在邏輯上,至於頁面就交給 Bootstrap 來幫我們實現,在調整成我們想要的效果,這樣可以節省很多排版上的時間,增加寫 Code 的時間。

 

現在就來說一下在 ASP.NET MVC 專案內如何加入 Bootstrap Frnamework

 

1. 先新增一個 ASP.NET MVC4 Web 的應用程式。

 [C#][ASP.NET MVC] 加入 Bootstrap  

 

2. 再來選擇空白。

[C#][ASP.NET MVC] 加入 Bootstrap  

 

3. 新增完後在方案總管可見以下資料。

[C#][ASP.NET MVC] 加入 Bootstrap  

 

4. 在來是透過工具 → 程式庫套件管理員 → Package Manager Console 來安裝 Bootstrap Frnamework

[C#][ASP.NET MVC] 加入 Bootstrap  

 

5.Console 視窗輸入 install-package twitter.bootstrap.mvc4

[C#][ASP.NET MVC] 加入 Bootstrap  

 

6. 接著同樣在 Console 視窗輸入 install-Package twitter.bootstrap.mvc4.sample

[C#][ASP.NET MVC] 加入 Bootstrap  

 

7. 完成後,在方案總管的結構。

[C#][ASP.NET MVC] 加入 Bootstrap  

 

倘若安裝 install-package twitter.bootstrap.mvc4,未安裝 install-Package twitter.bootstrap.mvc4.sample會出現以下錯誤訊息:

[C#][ASP.NET MVC] 加入 Bootstrap 

 

再來執行看看囉!

[C#][ASP.NET MVC] 加入 Bootstrap  

 

 

Reference:http://kkbruce.tw/

Reference:http://getbootstrap.com/

arrow
arrow
    創作者介紹
    創作者 mitblog 的頭像
    mitblog

    香腸炒章魚

    mitblog 發表在 痞客邦 留言(0) 人氣()