您现在的位置:首页 >> 前端 >> 内容

Bootstrap响应式实用工具

时间:2017/7/14 13:31:46 点击:

  核心提示:Bootstrap 提供了类似于栅格系统的辅助类,以便更好的实现对移动设备友好的开发。这些就是针对对不同屏幕 块级元素的可见和隐藏。对不同屏幕的分类完全类似于 栅格系统的 class 分类.visib...

Bootstrap 提供了类似于栅格系统的辅助类,以便更好的实现对移动设备友好的开发。这些就是针对对不同屏幕 块级元素的可见和隐藏。对不同屏幕的分类完全类似于 栅格系统的 class 分类

.visible-xs-* 超小屏幕手机 (<768px)可见 其余屏幕隐藏

.visible-sm-* 小屏幕平板 (≥768px) 可见 其余屏幕隐藏

.visible-md-* 中等屏幕桌面(≥992px)可见 其余屏幕隐藏

.visible-lg-* 大屏幕桌面 (≥1200px可见 其余屏幕隐藏

.hidden-xs 超小屏幕手机 (<768px)隐藏 其余屏幕可见

.hidden-sm 小屏幕平板 (≥768px) 隐藏 其余屏幕可见

.hidden-md 中等屏幕桌面(≥992px)隐藏 其余屏幕可见

.hidden-lg 大屏幕桌面 (≥1200px)隐藏 其余屏幕可见

从3.2.0开始 出现了不同屏幕下针对 css的 display属性的变体

.visible-*-block display: block;

.visible-*-inline display: inline;

.visible-*-inline-block display: inline-block;

以上的 * 这里不多做解释,上面说的很清楚了

Tags:BO OO OT TS 
作者:网络 来源:青梅煮酒论英雄的博客