參考
為什么前端工程師多不愿意用 Bootstrap 框架橄杨?
boostrap入門示例
Github bootstrap
http://getbootstrap.com/
《Node.js開發(fā)指南 ByVoid》 Page104
作為后端開發(fā)者榨了,你可能和我一樣都不太擅長設計,不過沒關系阔逼,我們可以利用已有的優(yōu)秀設計替久。如果你認同 Twitter 的簡潔風格鹃锈,那么 Twitter Bootstrap 是最好的選擇误甚。TwitterBootstrap 是由 Twitter 的設計師和工程師發(fā)起的開源項目,它提供了一套與 Twitter 風格一致的簡潔柒桑、優(yōu)雅的 Web UI弊决,包含了完全由 HTML、CSS魁淳、JavaScript 實現(xiàn)的用戶交互工具飘诗。不管你是資深的前端工程師,還是專業(yè)的后端開發(fā)者界逛,你都可以輕松地使用Twitter Bootstrap 制作出優(yōu)美的界面昆稿。
一、簡單示例
需要使用Jquery息拜,官網(wǎng)示例對Jquery使用了這種加載方式
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
crossorigin="anonymous"></script>
具體參考Subresource Integrity溉潭,HTML5 script 標簽的 crossorigin 屬性到底有什么用
我在Github bootstrap和Jquery官網(wǎng)把代碼都下載了净响,簡單示例如下
<!-- Bootstrap core CSS -->
<link href="dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<button type="button" class="btn btn-primary">提交按鈕</button>
<button type="button" class="btn btn-success">成功按鈕</button>
<button type="button" class="btn btn-danger">危險按鈕</button>
<script src="jquery-3.3.1.js"></script>
<script src="assets/js/vendor/popper.min.js"></script>
<script src="dist/js/bootstrap.min.js"></script>
<script src="assets/js/vendor/holder.min.js"></script>
</body>
更多示例參考boostrap入門示例