前端框架bootstrap使用

一個拖拽的bootstrap框架的前端佈局在線編輯工具:http://www.runoob.com/try/bootstrap/layoutit/#

將項目中用到的組件拖拽到合適的地方,然後點擊下載,把生成HTML下載下來,複製到自己網站的body部分

再配合ajax從後臺返回數據,就可以做出效果不錯的界面:

頭部添加這些引用:
<link href="//cdn.staticfile.org/twitter-bootstrap/3.0.1/css/bootstrap.min.css" rel="stylesheet">
<script src="//apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
<script type="text/javascript" src="//cdn.staticfile.org/jqueryui/1.10.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="//cdn.staticfile.org/jqueryui-touch-punch/0.2.2/jquery.ui.touch-punch.min.js"></script>
<script type="text/javascript" src="//cdn.staticfile.org/twitter-bootstrap/3.0.1/js/bootstrap.min.js"></script>

製作起來非常簡單,而且不是追求極致效果的,就足夠了。

 附上一張模板圖:

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章