如何让bootstrap表格自动出现水平滚动条?
上面图片中的bootstrap表格在尺寸缩小时全部挤成了一堆,这还算是响应式吗?我觉得应该出现水平滚动条,这样无论设备尺寸大小变化时也看到到全部了。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
上面图片中的bootstrap表格在尺寸缩小时全部挤成了一堆,这还算是响应式吗?我觉得应该出现水平滚动条,这样无论设备尺寸大小变化时也看到到全部了。
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
接受
或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
发布评论
评论(3)
将任何 .table 元素包裹在 .table-responsive 元素内,即可创建响应式表格,其会在小屏幕设备上(小于768px)水平滚动。当屏幕大于 768px 宽度时,水平滚动条消失。比如这样写:
1、上面表格内容只是折行而已,由于内容很少,而且周围空间足够,没有影响阅读。
2、响应式本来就是避免出现横向滚动条,还要手动拖拉滚动条查看被遮挡内容这才不是响应式。
所以 折行的内容你还觉得太多的话,一般就是隐藏掉,用另一个更简短的内容替换显示
http://www.bootcdn.cn/
这有个bootstrap的很简单的表格,开始标题和内容是平行的,然后缩小一点窗口变成上下格式了,再缩小到手机尺寸,内容完全隐藏只剩标题了。基本都是这个套路,比如你这个表格interner Explore 4.0这种你觉得堆起来还是太多了,可以隐藏掉,换一个IE4.0替代。
我记得bootstrap好像有提供class显示水平条吧,实在不行自己改下吧