然爸读书笔记(2014-10)----Bootsrap用户手册

然爸读书笔记(2014-10)----Bootsrap用户手册_第1张图片

本来其实这方面的知识,可以直接在网站上看,但是自己是web前端的小白。基本不懂。所以,还是买一本书来看,更好些。体现出我对前端的重视。

Bootstrap是快速开发Web应用程序的前端工具包。它是一个CSS和HTML的集合,它使用了最新的浏览器技术,给你的Web开发提供了时尚的版式,表单,buttons,表格,网格系统等等。

第一章:Bootstrap提供的网站框架

(1)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文件,也需要单独下载。

第二章: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"。

你可能感兴趣的:(读书笔记)