建站
咨詢
售后
建站咨詢
新聞中心
1.Bootstrap簡介：
1. 概念： 一個前端開發(fā)的框架，Bootstrap，來自 Twitter，是目前很受歡迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它簡潔靈活，使得 Web 開發(fā)更加快捷。
* 框架:一個半成品軟件，開發(fā)人員可以在框架基礎(chǔ)上，在進(jìn)行開發(fā)，簡化編碼。
* 好處：
1. 定義了很多的css樣式和js插件。我們開發(fā)人員直接可以使用這些樣式和插件得到豐富的頁面效果。
2. 響應(yīng)式布局。
* 同一套頁面可以兼容不同分辨率的設(shè)備。
2. 快速入門
1. 下載
2. 在項目中將這三個文件夾復(fù)制{css樣式文件夾、js、fonts字體及圖標(biāo)文件夾}
3. 創(chuàng)建html頁面，引入必要的資源文件。如：jQuery
3.演示案例
你好，世界!
4. 響應(yīng)式布局
同一套頁面可以兼容不同分辨率的設(shè)備。
* 實現(xiàn)：依賴于柵格系統(tǒng)：將一行平均分成12個格子，可以指定元素占幾個格子
* 步驟：
1. 定義容器。相當(dāng)于之前的table、
* 容器分類：
1. container：兩邊留白
2. container-fluid：每一種設(shè)備都是100%寬度
2. 定義行。相當(dāng)于之前的tr 樣式：row
3. 定義元素。指定該元素在不同的設(shè)備上，所占的格子數(shù)目。樣式：col-設(shè)備代號-格子數(shù)目
* 設(shè)備代號：
1. xs：超小屏幕 手機(jī) (<768px)：col-xs-12
2. sm：小屏幕 平板 (≥768px)
3. md：中等屏幕 桌面顯示器 (≥992px)
4. lg：大屏幕 大桌面顯示器 (≥1200px)
* 注意：
1. 一行中如果格子數(shù)目超過12，則超出部分自動換行。
2. 柵格類屬性可以向上兼容。柵格類適用于與屏幕寬度大于或等于分界點大小的設(shè)備。
3. 如果真實設(shè)備寬度小于了設(shè)置柵格類屬性的設(shè)備代碼的最小值，會一個元素沾滿一整行。
5. CSS樣式和JS插件
1. 全局CSS樣式：
* 按鈕：class="btn btn-default"
* 圖片：無錫渤海醫(yī)院 https://yyk.familydoctor.com.cn/20612/
* class="img-responsive"：圖片在任意尺寸都占100%
* 圖片形狀
方形
圓形
*相框
* 表格
* table
* table-bordered
* table-hover
* 表單
* 給表單項添加：class="form-control"
2. 組件：
* 導(dǎo)航條
* 分頁條
3. 插件：
* 輪播圖
演示案例
搜索
Toggle navigation
首頁
Link (current)
Link
Link
Link
另外有需要云服務(wù)器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內(nèi)外云服務(wù)器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務(wù)器、裸金屬服務(wù)器、高防服務(wù)器、香港服務(wù)器、美國服務(wù)器、虛擬主機(jī)、免備案服務(wù)器”等云主機(jī)租用服務(wù)以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務(wù)可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應(yīng)用場景需求。
網(wǎng)站標(biāo)題：WEB前端響應(yīng)式布局之BootStarp的使用-創(chuàng)新互聯(lián)
網(wǎng)址分享：http://www.dlmjj.cn/article/diehop.html
