怎样实现表格宽度太宽时,浏览器底部出现横向滚动条

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了怎样实现表格宽度太宽时,浏览器底部出现横向滚动条相关的知识,希望对你有一定的参考价值。

参考技术A 给Table添加样式 overflow-x :scroll
或者在Table外面加个DIV,对DIV加overflow-x : scroll,这样灵活些。
参考技术B 先固定容器的宽,然后overflow-x:auto;例如:
div

width:150px;
overflow-x:auto;

element-ui table下方出现滚动条的情况

参考技术A 在使用element-ui table组件时,浏览器中出现了两条横向的滚动条,一条是浏览的自己的,一条是table的。table出现滚动条的原因是父元素的宽度不够,所以只要给父元素足够的宽度table的滚动条就会消失。
这种情况一般会出现在小屏幕上。

以上是关于怎样实现表格宽度太宽时,浏览器底部出现横向滚动条的主要内容,如果未能解决你的问题,请参考以下文章

html 自动显示横向滚动条

element-ui table下方出现滚动条的情况

Latex表格太宽处理方法 (How to shorten Latex table length)

IE6下出现横向滚动条问题的解决方案

vue中如何使用better-scroll实现横向滚动?

eltable滚动文字抖动