這篇文章主要介紹了運(yùn)用bootstrap進(jìn)行頁面布局的方法,具有一定借鑒價值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。


首先我們需要在準(zhǔn)備的cshtml文件中導(dǎo)入bootstrap的css文件,如下圖所示:

然后我們先來看一下平時我們定義一個區(qū)塊的方式,如下圖所示,聲明div的寬度。但是當(dāng)屏幕分辨率發(fā)生變化時就會出問題了。

那在bootstrap中為我們定義了柵欄系統(tǒng),如下圖所示,直接調(diào)用樣式即可。

如果要在不同的設(shè)備之間自適應(yīng)的話,用下面的樣式:

還有的是如果你一行想放兩列內(nèi)容的話,那么就如下所示,將樣式后面的12拆成6。

最后,一般都把一行的內(nèi)容包裹在row樣式中,另外最后會加clearfix清除浮動。

綜上所述,運(yùn)用bootstrap進(jìn)行頁面布局主要就是運(yùn)用其柵欄系統(tǒng),確定好多少列為一行即可。
感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享運(yùn)用bootstrap進(jìn)行頁面布局的方法內(nèi)容對大家有幫助,同時也希望大家多多支持創(chuàng)新互聯(lián)建站,關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道,遇到問題就找創(chuàng)新互聯(lián)建站,詳細(xì)的解決方法等著你來學(xué)習(xí)!
本文標(biāo)題:運(yùn)用bootstrap進(jìn)行頁面布局的方法-創(chuàng)新互聯(lián)
網(wǎng)頁地址:http://www.chinadenli.net/article22/degdcc.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供搜索引擎優(yōu)化、網(wǎng)站營銷、建站公司、標(biāo)簽優(yōu)化、響應(yīng)式網(wǎng)站、品牌網(wǎng)站建設(shè)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容