Bootstrap基礎筆記

主要還是對照文檔，一些樣式可以直接使用或者修改後使用。

Bootstrap：
	概念：一個前端開發的框架，Bootstrap，來自Twitter，是目前很受歡迎的前端框架。Bootstrap
	  是基於HTML、CSS、JavaScript的，它簡潔靈活，使得web開發更加快捷。
	框架：一個半成品軟件，開發人員可以在框架基礎上，再進行開發，簡化編碼。
	好處：
		1、定義了很多css樣式和js插件，開發人員可以直接使用這些樣式和插件得到豐富的頁面效果。
		2、響應式佈局。
			同一套頁面可以兼容不同分辨率的設備。

響應式佈局
	同一套頁面可以兼容不同分辨率的設備。
	實現：依賴於柵格系統：將一行平均分成12個格子，可以指定元素佔幾個格子
	步驟：
		1、定義容器，相當於之前的table
			容器分類：
				1、container ：固定寬度
				2、container fluid ：每一種設備都是100%寬度
		2、定義行，相當於之前的tr   樣式：row
		3、定義元素，指定該元素再不同的設備上，所佔的格子數目。樣式：設備代號-格子數目
			設備代號：
				1、xs：超小屏幕 手機（<768px）：col-xs-12
				2、sm：小屏幕 平板（>=768px）
				3、md：中等屏幕 桌面顯示器
				4、lg：大屏幕 大桌面顯示器（>=1200px）
		注意：如果格子數目超過12，則超出部分自動換行
			  柵格類屬性可以向上兼容，柵格類適用於與屏幕寬度大於或等於分界點大小的設備
			  如果真是設備寬度小於了設置柵格類屬性的設備代碼的最小值，會一個元素佔滿一整行
			  
CSS樣式和JS插件
	全局CSS樣式：
		按鈕：class="btn btn-default"
		圖片:class="img-responsive":圖片在任意尺寸都佔100%
			圖片形狀：
			<img src="..." alt="..." class="img-rounded">方
			<img src="..." alt="..." class="img-circle">圓
			<img src="..." alt="..." class="img-thumbnail">相框
		表格：table
			 class="table table-bordered table-hover table-condensed"
		表單：form