然爸讀書筆記(2014-10)----Bootsrap用戶手冊

原本其實這方面的知識,能夠直接在網站上看,可是本身是web前端的小白。基本不懂。因此,仍是買一本書來看,更好些。體現出我對前端的重視。css

Bootstrap是快速開發Web應用程序的前端工具包。它是一個CSS和HTML的集合,它使用了最新的瀏覽器技術,給你的Web開發提供了時尚的版式,表單,buttons,表格,網格系統等等。前端

第一章:Bootstrap提供的網站框架web

(1)Bootstrap的文件結構bootstrap

bootstrap/
├── css/
│   ├── bootstrap.css
│   ├── bootstrap.min.css
│   ├── bootstrap-theme.css
│   └── bootstrap-theme.min.css
├── js/
│   ├── bootstrap.js
│   └── bootstrap.min.js
└── fonts/
    ├── glyphicons-halflings-regular.eot
    ├── glyphicons-halflings-regular.svg
    ├── glyphicons-halflings-regular.ttf
    └── glyphicons-halflings-regular.woff瀏覽器

(2)響應式設計框架

要使bootstrap支持響應式佈局,必須在<head>標籤中添加<meta>標籤。另外,你下載的文件中沒有響應式的css文件,也須要單獨下載。svg

第二章:Bootstrap預約義的css樣式工具

(1)排版佈局

bootstrap定義了6個級別的標題,分別是h1-h6,h1是36像素高;用class="lead"強調段落;用<strong>來強調具體文本;用<abbr>來標記縮寫詞。網站

(2)表格

適用<table>,<tr>,<td>來制定表格。

(3)表單

適用<form>制定表單。

第三章:Bootstrap內置的佈局組件

(1)下拉菜單

class="dropdown-menu",用pull-right來右對齊等。

(2)按鈕組

class="btn-group"。

(3)導航元素

class="nav";class="navbar"。

(4)標籤

class="label";class="badge"。

(5)縮略圖

class="thumbnail"。

(6)進度條

class="progress"。

第四章:Bootstrap支持的JavaScript插件

(1)模態框

class="modal"。

相關文章
相關標籤/搜索