Bootstrap学习记录点滴

阅读更多

 

1. 学习Bootstrap必进的学习网站

 

Bootstrap中文网：http://www.bootcss.com/

 

2. 表格

table 基本表格样式

 

table-striped 条纹表格  类似斑马线的表格样式

table-hover  鼠标悬停表格（鼠标悬停时会变色）

   table-bordered   有边框的表格

table-condensed 紧缩的表格 Bootstrap默认的表格样式单元格特别大，使用这个样式可以减少单元格的大小

 

  实例：

 

					

						
序号
合同名称
公司名称
日期
					
					

						

							
{{index+1}}
							
{{m.q_name}}
							
{{m.q_company}}
{{m.q_date}}
						
					
				

 

 

3. 表单

 

form-inline:  表单在一行内

form-horizontal 类，并联合使用 Bootstrap 预置的栅格类，可以将 label 标签和控件组水平并排布局

 

 4. 分页

 

pagination 使用在ul上。

 

5. 弹出窗口：

 

一个修改密码弹出窗口的示例：

 

	

		

			

				
					×
				
				
修改密码
			
			

				

					

						密码
						

							
						

					
				
				

					

						确认密码
						

							
						

					
				


			
			

				关闭
				确认修改
			
		
		
	
	

 

 6. Tab 页签切换

 

		

			歌曲管理
		
		

			歌手管理
		
	
	
	

		

			music
		
		

			singer