網(wǎng)站制作NEWS
網(wǎng)頁到手機端布局全亂了,bootstrap該怎樣使用
下面我在這里簡單的介紹下Bootstrap框架。Bootstrap框架屬于UI框架,這個和jQuery不太一樣,其實準(zhǔn)確的描述Bootstrap框架屬于css框架而非javascript框架,但是它本身也使用javascript來完善Bootstrap框架的視覺效果。此外,Bootstrap框架十分超前,在支持html5和css3的瀏覽器上表現(xiàn)特別好,而且對移動終端的瀏覽器支持也是相當(dāng)優(yōu)秀。一個完整的Bootstrap框架包含如下四個部分:腳手架(不知道官網(wǎng)為啥這么翻譯):用于重置背景、鏈接樣式、柵格系統(tǒng)等,并包含兩個簡單的布局結(jié)構(gòu)。Bootstrap的樣式使用了lesscss技術(shù),比如重置背景這樣的操作,這些比較簡單我就不敘述了,腳手架里最出彩的是柵格系統(tǒng)和布局。柵格系統(tǒng)是將頁面寬度分成12列,柵格系統(tǒng)分為兩種類型,一種是默認(rèn)柵格系統(tǒng),這時候柵格系統(tǒng)是按940px像素進(jìn)行等分,我們可以使用span1,span4這樣的class屬性操作默認(rèn)柵格布局,另一種是流式柵格系統(tǒng),這個時候分列的寬度就不是固定,而是根據(jù)你可視頁面進(jìn)行12等分,同樣可以使用span1,span4操作流式柵格。這個系統(tǒng)非常之好,做css最難的就是div布局,使用柵格系統(tǒng)可以大大簡化div的布局操作。另外一個就是做布局操作了,布局也分為固定和流式,讓不太精通css布局也能輕松操作布局?;镜腸ss樣式。Bootstrap給出了一樣常用的HTML元素的樣式,例如:按鈕、表單和文字等等。大部分做網(wǎng)站的人都不是美工出身,做出賞心悅目的網(wǎng)頁是件很困難的事情,css提供的樣式很專業(yè)很精美,能讓我們輕松開發(fā)出一套精美的網(wǎng)站Css組件:Bootstrap還提供一些常用的css組件,同樣很優(yōu)秀很棒。Javascript插件:Bootstrap是個開放的系統(tǒng),我們可以隨意擴展Bootstrap,特別是javascript的框架,這樣Bootstrap就會更加專業(yè)。Bootstrap是個操作性質(zhì)的框架,沒必要做深入分析,最關(guān)鍵是有沒有好的使用實例,我下載Bootstrap發(fā)現(xiàn),下載包里的example不是太強大,例子都在它的官網(wǎng)上,很多對css和javascript不是特別熟悉的人使用起來都不太習(xí)慣,因此我將這些例子進(jìn)行了整合,作為單獨的例子工程,這個工程非常全面,我在網(wǎng)上找過,目前還沒有比我整理的更詳盡的例子,大伙下載下來按照我的工程目錄結(jié)構(gòu)就可以進(jìn)行開發(fā)了。
多重隨機標(biāo)簽