小編給大家分享一下Bootstrap如何使用,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
讓客戶滿意是我們工作的目標(biāo),不斷超越客戶的期望值來自于我們對這個行業(yè)的熱愛。我們立志把好的技術(shù)通過有效、簡單的方式提供給客戶,將通過不懈努力成為客戶在信息化領(lǐng)域值得信任、有價(jià)值的長期合作伙伴,公司提供的服務(wù)項(xiàng)目有:空間域名、網(wǎng)絡(luò)空間、營銷軟件、網(wǎng)站建設(shè)、原州網(wǎng)站維護(hù)、網(wǎng)站推廣。
一、Bootstrap簡介
Bootstrap,來自 Twitter,是目前很受歡迎的前端框架。Bootstrap是基于 HTML5、CSS3和Javascriopt開發(fā)的,它在 jQuery的基礎(chǔ)上進(jìn)行了更為個性化和人性化的完善,形成一套自己獨(dú)有的網(wǎng)站風(fēng)格,并兼容大部分jQuery插件,為實(shí)現(xiàn)快速開發(fā)提供了一套前端工具包,包括豐富的布局、柵格、豐富的Web組件和jQuery插件等,并能通過Less進(jìn)行樣式定制。
二、Hello Bootstrap
1.建立項(xiàng)目目錄結(jié)構(gòu),新建app、css、font、img和js目錄,其中app存放angular相關(guān)子模板和控制器。向css目錄中拷貝入ie10-viewport-bug-workaround.css,向js目錄中拷貝入ie8-responsive-file-warning.js、ie-emulation-modes-warning.js和ie10-viewport-bug-workaround.js,這幾個文件是讓bootstrap在ie瀏覽器中針對ie的兼容性做的優(yōu)化。
?
2.新建index.html頁面,在中引入bootstrap.css及兼容ie的css:
3.在底部依次引入jquery.js、bootstrap.js及兼容ie的js:
?
4.編寫頁面內(nèi)容,先在標(biāo)簽下加入
,然后在其中插入具體頁面代碼,本例包括頂部導(dǎo)航和一個,完整代碼如下:Hello Bootstrap Hello Bootstrap !
This example is a quick exercise to illustrate how the default, static navbar and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.
效果如下:
以上是“Bootstrap如何使用”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學(xué)習(xí)更多知識,歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道!