本篇文章為大家展示了在HTML頁面中如何使用bootstrap框架,代碼簡明扼要并且容易理解,絕對能使你眼前一亮,通過這篇文章的詳細介紹希望你能有所收獲。
為企業(yè)提供網(wǎng)站設計、做網(wǎng)站、網(wǎng)站優(yōu)化、全網(wǎng)整合營銷推廣、競價托管、品牌運營等營銷獲客服務。創(chuàng)新互聯(lián)公司擁有網(wǎng)絡營銷運營團隊,以豐富的互聯(lián)網(wǎng)營銷經(jīng)驗助力企業(yè)精準獲客,真正落地解決中小企業(yè)營銷獲客難題,做到“讓獲客更簡單”。自創(chuàng)立至今,成功用技術實力解決了企業(yè)“網(wǎng)站建設、網(wǎng)絡品牌塑造、網(wǎng)絡營銷”三大難題,同時降低了營銷成本,提高了有效客戶轉化率,獲得了眾多企業(yè)客戶的高度認可!
Bootstrap 是基于 HTML、CSS 和 JavaScript 的一款前端框架,其可以用來快速開發(fā) Web 應用程序和網(wǎng)站,且所有的主流瀏覽器都支持 Bootstrap。因為該框架幾乎包含了整個庫的移動設備優(yōu)先的樣式,可以進行響應式設計,且容易上手,因此被廣泛使用。接下里直接介紹bootstrap框架的使用方法。相關視頻教程推薦:bootstrap教程
bootstrap框架官網(wǎng):http://v3.bootcss.com
第一步:進入官網(wǎng),下載Bootstrap 包,點擊下載bootstrap,有三種文件可以選擇,一般我們下載第一個就可以了。
第二步:下載成功后有一個壓縮文件,解壓后可以看到一個文件夾包含css、fonts和 JS,然后將這些文件導入到編輯器里面,基本工作就完成了。(主要:不可以隨便更改bootstrap默認的路徑,否則會出錯)
第三步:新建一個HTML文件,在
第四步:引入jQuery后,再用link引入CSS文件,最后用script引入JavaScript文件(注意:文件引入的順序不能錯,先是jQuery,再是CSS,最后是JavaScript),如圖所示
第五步:現(xiàn)在可以編寫頁面了,只需套用 bootstrap中css定義的class類名即可,如有不清楚的可以訪問bootstrap官網(wǎng) 。接下來就用按鈕做個示范,在
也許有人會問,沒有給頁面添加樣式,那它的樣式怎么來的呢?其實CSS樣式已經(jīng)封裝在引入的CSS文件中,運行時直接被調用。如果對bootstrap默認的樣式不滿意,你可以找到對應的類名,修改成自己喜歡的樣式。
上述內容就是在HTML頁面中如何使用bootstrap框架,你們學到知識或技能了嗎?如果還想學到更多技能或者豐富自己的知識儲備,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道。