天天看点

bootstrap (前端css框架)

bootstrap是一个前端css框架,由twitter公司开发。它简洁、直观、漂亮,特点之一是能够根据不同尺寸的设备(如手机、平板、笔记本与台式机的显示器尺寸不一)来响应式地布局,背后原理是css的媒体查询功能。

实现响应式布局的<meta>标签:

图片也可响应式处理:

表格也可响应式处理:

通过把任意的 .table 包在 .table-responsive class

内,您可以让表格水平滚动以适应小型设备(小于 768px)。当在大于 768px 宽的大型设备上查看时,您将看不到任何的差别。

栅格布局的响应式:

小屏设备上,col-xs-10 col-xs-offset-2起作用, col-md-5 col-md-offset-7不起作用。中等屏幕设备上则反之。

屏幕的宽度被等分为12份。注意.class必须放在.row内。

继续阅读