码迷,mamicode.com
首页 > 其他好文 > 详细

boostrap各种设备大小,以及不同设备的隐藏和显示

时间:2020-09-18 02:33:05      阅读:31      评论:0      收藏:0      [点我收藏+]

标签:额外   boost   table   区别   平板   屏幕   大小   body   多少   

一:屏幕尺寸的区别
.col-xs- 超小屏幕 手机 (<768px)
.col-sm- 小屏幕 平板 (≥768px)
.col-md- 中等屏幕 桌面显示器 (≥992px)
.col-lg- 大屏幕 大桌面显示器 (≥1200px)

一个栅格代表1,总共十二个。以上四个类分别表示当屏幕的宽度为多少时,触发相应的类

二:不同尺寸的显示和隐藏

Class 设备
.visible-xs 额外的小设备(小于 768px)可见
.visible-sm 小型设备(768 px 起)可见
.visible-md 中型设备(768 px 到 991 px)可见
.visible-lg 大型设备(992 px 及以上)可见
.hidden-xs 额外的小设备(小于 768px)隐藏
.hidden-sm 小型设备(768 px 起)隐藏
.hidden-md 中型设备(768 px 到 991 px)隐藏
.hidden-lg 大型设备(992 px 及以上)隐藏

boostrap各种设备大小,以及不同设备的隐藏和显示

标签:额外   boost   table   区别   平板   屏幕   大小   body   多少   

原文地址:https://www.cnblogs.com/cn-oldboy/p/13677217.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!