Bootstrap - 從基礎模板到更高級的例子

我認爲這可能是偏離主題的，但我不知道還有什麼其他問題或者其他什麼方向來指導它。我是一名新的Web開發人員，我習慣從頭開始構建CSS和HTML以製作各種工具。我想進入像Bootstrap這樣的框架，讓事情看起來更專業一些，但我真的很難理解如何使用它。Bootstrap - 從基礎模板到更高級的例子

我努力理解文件結構的引導提供和它應該活在我的網絡服務器。基本縮小版下載由css，fonts和js文件夾組成。然而，像jumbotron參考其他文件的例子如

<!-- Bootstrap core CSS --> 
<link href="../../dist/css/bootstrap.min.css" rel="stylesheet"> 

<!-- IE10 viewport hack for Surface/desktop Windows 8 bug --> 
<link href="../../assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet"> 

<!-- Custom styles for this template --> 
<link href="jumbotron.css" rel="stylesheet"> 

<!-- Just for debugging purposes. Don't actually copy these 2 lines! --> 
<!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]--> 
<script src="../../assets/js/ie-emulation-modes-warning.js"></script>

但我不知道這些文件應該居住在哪裏。我是否需要修改每個這些href鏈接？文件結構應該是什麼樣子？

感謝您的任何幫助。

來源

2016-09-22 Michael

我不認爲你需要所有這些的...只需添加引導，jQuery的的精縮CSS，然後精縮引導的JS，你是好去...您可以去這裏，並創建一個樣本模板：HTTP： //www.initializr.com/ – Navnit

@Navnit，希望我知道這存在。很有幫助 – Michael

很高興幫助..;） – Navnit

如果你看一下引導的最新版本getting started guide，你將能夠了解文件夾結構。

Bootstrap已將不同類型的文件分隔到不同的文件夾中。

bootstrap/ 
     ├── css/ 
     │ ├── bootstrap.css 
     │ ├── bootstrap.css.map 
     │ ├── bootstrap.min.css 
     │ ├── bootstrap.min.css.map 
     │ ├── bootstrap-theme.css 
     │ ├── bootstrap-theme.css.map 
     │ ├── bootstrap-theme.min.css 
     │ └── bootstrap-theme.min.css.map 
     ├── js/ 
     │ ├── bootstrap.js 
     │ └── bootstrap.min.js 
     └── fonts/ 
     ├── glyphicons-halflings-regular.eot 
     ├── glyphicons-halflings-regular.svg 
     ├── glyphicons-halflings-regular.ttf 
     ├── glyphicons-halflings-regular.woff 
     └── glyphicons-halflings-regular.woff2

如果您想使用Bootstrap提供的插件，則需要JS文件。如果你不想使用任何plugins那麼你不必包含js文件。

在你上面的例子，第一個文件是顯而易見的，它的一個bootstrap.css文件。第二個文件是固定的，即引導程序的某些功能在ie10中不起作用。第三個文件是應用程序特定文件第四個是用於調試的目的，如評論中所述。

，如果你使用的是涼亭或其他一些工具，依賴管理，那麼所有的第三方的依賴應該bower_components或供應商文件夾eaither去。你所有的應用程序特定的CSS應該駐留在你的應用程序文件夾中。

希望它有幫助。

來源

2016-09-22 05:46:28

Bootstrap - 從基礎模板到更高級的例子

回答

相關問題