FSWD_BootStrap

Course Overview
响应式设计

grid system

CSS
Button

Form

Tables

panel

well

image

media

alert

progress bar

JS
review css

js and jquery

use of jquery

tabs and tabbed navigation

hide and seek

scrollspy and affix

Tooltips Popovers and Modals

carousel

Nodejs
NPM

CSS preprocessor
example

less

sass

Web tools

Course Overview

响应式设计

适应于各种大小的屏幕。

grid system

CSS

Button

Form

Tables

panel

well

image

media

alert

progress bar

JS

review css

BS的CSS是重叠递进的。

js and jquery

写js code是很繁琐的，因此构建在上面的jquery以及bootstrap方便了用户使用。

use of jquery

引入js文件



使用jquery

tabs and tabbed navigation

Design a web page to use tabbed navigation for organizing the content

Use tab panes and organize the content into the panes

Facilitate navigation among the tab panes using the tabbed navigation elements

hide and seek

Use the collapse plugin to hide/reveal content

Construct the accordion using panels and panel-group class

Use the scrollspy to reflect the current position of the scroll

Employ the affix plugin to fix the position of the nav element after an initial scroll

scrollspy and affix

Design an accordion using the collapse plugin together with the panel component and panel-group class

Use a scrollspy to highlight the current scroll position in a nav

Use the affix plugin together with the scrollspy on the side nav component

Tooltips, Popovers and Modals

Set up a tooltip to be displayed when the user hovers over an area of the page

Enable popovers when the user clicks on a link or button

Reveal and hide modals when the user clicks on a link or button

carousel

Use a carousel component in your web page

Configure various aspects of the carousel

Add controls to the carousel to manually control it

Node.js

Node js runtime



Node.js可以使JS用在后端，所以js可以前后端都用。

NPM

CSS preprocessor

CSS有很多正常编程语言可以实现的功能实现不了，这就是preprocessor的来源。

example

less

sass

Web tools

developed using js

Understand the need for web tools

Make use of Bower to automatically fetch Web packages and assets.





好处是只需要更改json file，而不需要包含所有的依赖。