-
Bootstrap 全局樣式的特點(diǎn)
????代碼整潔
????風(fēng)格統(tǒng)一
????美觀易用
查看全部 -
標(biāo)題對應(yīng)的字號h1=36px;
查看全部 -
先引入css(min)? 再引入jQuery 再引入js(min)
查看全部 -
【Bootstrap的特性】
響應(yīng)式設(shè)計、柵格布局、完整的類庫
JQuery插件、不同的使用場景
【Jetstrap】
專門針對Bootstrap的開發(fā)工具：Jetstrap
地址：jetstrap.com
【Btootstrap下載地址】
中文地址：www.bootcss.com
查看全部 -
1-1bootstrap簡介 （1）bootstrap是twitter公司開發(fā)基于HTML\CSS\javascript 的前端框架 （2）為實現(xiàn)web應(yīng)用程序快速開發(fā)提供的一套前端工具包 （3）響應(yīng)式布局 （4）移動設(shè)備優(yōu)先 目標(biāo)：1）bootstrap全局樣式2）viewport的意義3）柵格化布局 4）字體、圖標(biāo) 5）實現(xiàn)響應(yīng)式布局開發(fā)
查看全部 -
h1 36px
h2? 30px
h3 24px
h4 18px
h5 14px
h6 12px
查看全部 -
表格的樣式
table table-striped table-bordered table-hover
表格信息樣式
success
warning
info
danger
active
查看全部 -
Bootstrap中的插件-data屬性
通過data屬性控制頁面交互
$(document).off('.data-api')????解除屬性綁定
查看全部 -
面板
? .panel????代表面板
? .panel-heading? ? 代表面板頭部
? .panel-body????代表面板內(nèi)容
? .panel-footer????代表面板的注腳
查看全部 -
列表
.list-group 代表列表組
.list-group-item 代表列表項
.badge 代表狀態(tài)數(shù)
.active 代表選中狀態(tài)
查看全部 -
進(jìn)度條
.progress 表示進(jìn)度條
通過狀態(tài)類改變進(jìn)度條的顏色
.progress-bar-striped 使得進(jìn)度條顏色漸變
查看全部 -
分頁
? ,pagination 在父元素中添加表示分頁
? .pager????放置在翻頁區(qū)域
? .previous? 把鏈接向左對齊，????.next 把鏈接向右對齊
查看全部 -
導(dǎo)航
以一個帶有class? .nav的無序列表開始
.nav-tabs? 代表可切換的導(dǎo)航
.nav-pills????代表膠囊導(dǎo)航
.nav-judtified????使導(dǎo)航垂直
查看全部 -
控件組
.input-group????????表示控件組
.input-group-addon????可放置額外內(nèi)容及圖標(biāo)
查看全部 -
下拉菜單
.dropdown? 控制組件為下拉
.dropdown-menu-right 代替 .pull-right 右對齊
.divider????分割線
查看全部
舉報