解决双滚动条

最新推荐文章于 2024-01-18 08:05:08 发布
最新推荐文章于 2024-01-18 08:05:08 发布
阅读量322 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： 前端 javascript css ui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/Zing_ing/article/details/131937738
为解决子元素滚动条问题，可以将父元素设置为overflow:hidden，利用Element-UI的滚动条组件，子元素无需设置overflow:auto。若无此组件，则需子元素设置overflow:auto。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

在这里插入图片描述
子元素的滚动条设置了element-ui的滚动条
解决方案：找到父元素设置overflow:hidden;，由于使用了element-ui的滚动条，子元素不需要设置overflow:auto;，如果没有使用的话，子元素需要设置overflow:auto;。

Frilled Lizard
关注
ABAP 屏幕双滚动条
Pegasus666的博客
06-09 1400
当我们在屏幕中加入子屏幕的时候出现双滚动条其实很容易解决。 首先看一下在主屏幕中画子屏幕的占比。长宽高 146 52 8 再去子屏幕看看实际的占比 155 48 就发现原来是长度大于主屏幕中的值，只要找到子屏幕在上图这里调整到比主屏幕中的区域小就行了，当然调整了记得看一下子屏幕中的区域是否能放下全部控件，不行的话那就要调整主屏幕中的子屏幕的区域了。总之子屏幕的参数必须小于主屏幕中子屏幕的设定的长宽高范围 ...
使用了element UI页面出现两个滚动条
m0_56302604的博客
03-19 3627
当 el-main里面内容过多时，会出现多一个滚动条： 通过检查发现这里 el-main 的overflow用的是 auto ： 之前我设置了一个global.css文件用来设置一些全局的样式，所以可以在该文件里添加如下代码： global.css /* 解决内部滚动条 */ .el-main { overflow:visible; } ...
解决el-dialog弹框出现后页面滚动条可滚动问题
热门推荐
肖帅的博客
05-26 1万+
问题：el-dialog弹框出现后页面纵向滚动条可滚动问题 实现效果：当弹框出现后，滚动条不可使用即不可纵向滚动 发现问题： 在开发中在body元素上添加overflow: hidden;发现不起作用，以为滚动条出现在body下的某个div上，经过大量时间的排查，最后发现滚动条是出现在html标签上。于是在html上使用“overflow: hidden;”后，将body的标签上使用overflow: auto; 解决问题： 使用如下标签： html {overflow: hidden;height: 10
el-dialog 弹窗弹出，导致两个滚动条，影响用户体验
weixin_39418338的博客
06-21 6491
el-dialog 弹窗弹出，导致两个滚动条，影响用户体验
移动端列表页面添加v-infinite-scroll后，页面出现两个滚动条，设置overflow: hidden无效
moxucheng_li的博客
12-13 875
移动端列表页面添加v-infinite-scroll后，页面出现两个滚动条，设置overflow: hidden无效 设置最外层bodyBox为overflow: hidden;width: 100%; height: 100%;，想去除最外层滚动条，无效，滚动条还是存在两个 <el-tabs v-model=“activeName” @tab-click=“handleClick”> 用户管理 配置管理 角色管理 定时任务补偿 {{ i }} 如何设置只有内部一个滚动条
出现2个滚动条问题
最新发布
qq_42891199的博客
01-18 1403
不要给 el-option 的高度设置为 1200px, 太长了, 导致 el-option 的父容器容纳不下 el-option。给 el-option 的高设置为 100%后的效果如下。第二个滚动条是因为 el-option 太长导致的。第一个滚动条是因为 el-tree 太长导致的。
iframe去除双滚动条
心若向阳 无谓悲伤
06-07 3377
iframe嵌套的内容多的时候会自带滚动条一、问题描述二、问题处理1.思路2.实现三、效果 一、问题描述 当iframe嵌套的内容多的时候会自带滚动条，致使出现双滚动条，如图 二、问题处理 1.思路 使得iframe的高度和自动根据内容的大小进行调控 2.实现 1、父页面增加以下内容，即根据页面内容动态给iframe高度的赋值： <script type="text/javascript"> function setIframeHeight() { var iframe
解决ReportViewer的双竖滚动条的问题
11-24
解决 ReportViewer 的双竖滚动条的问题 解决 ReportViewer 的双竖滚动条的问题是一种常见的 IT 业界问题，而解决该问题需要对 ReportViewer 的使用和 CSS 样式进行深入的理解。在本文中，我们将详细介绍如何解决 ...
原生JS控制多个滚动条同步跟随滚动效果
10-18
在网页设计与开发中，实现两个或多个滚动条同步滚动是一种常见的用户交互需求，尤其在涉及代码编辑器、文档预览、聊天界面等场景时。本文将详细介绍使用原生JavaScript实现多个滚动条同步跟随滚动效果的方法和原理。...
解决跨域页面双滚动条问题的JavaScript方法
为了解决跨域条件下的双滚动条问题，通常会采取以下几种策略： #### 1. 设置iframe的属性 在使用iframe时，设置其属性`scrolling="no"`可以阻止浏览器显示滚动条。但这样做的副作用是，如果iframe的内容超出了其...
el-scrollbar滚动条分析
pscool的博客
03-17 851
现在把box2的宽度该称高跟box2相同的300px，是不会出现滚动条的，但是如果box2里面的元素的宽度大于了box1的宽度，那么box1仍然会出现滚动条，这也就是说，只要box1里面的元素超出了范围，不管是不是直接子元素，都会出现滚动条。为了看懂el-scrollbar的滚动条，先看一个水平滚动条的示例：一个box1里面套了一个box2，其中box2的宽度和box2的宽度相等，这种情况下，box1在水平方向上是没有滚动条的（box1使用了overflow-x:auto）。移动下位置试试，如下。
使用el-tooltip 页面出现双滚动条
weixin_66130133的博客
12-12 1397
使用el-tooltip 页面出现双滚动条
el-scrollbar出现横向滚动条解决方案
简单点的博客
12-20 1862
el-scrollbar出现横向滚动条解决方案
elementPlus关闭弹窗，页面原先滚动条消失
Stephy_Yy
03-09 1055
一开始以为是弹窗内容超过一屏引起，改为一屏内也不能解决。 打开控制台，发现弹窗后自动给body标签加上了类el-popup-parent–hidden，关闭后也没去除，因此手动删除该类。 document.getElementsByTagName('body')[0].className = ''; ...
element-ui中使用＜el-container＞在谷歌浏览器出现两个滚动条的解决方案
daniuge_99的博客
03-09 2336
vue2 element-ui
【bug】el-popover样式问题引起页面双滚动条，单独页面设置body样式
花椒和蕊的博客
01-06 2495
el-popover样式问题
【干货分享】解决element弹框组件导致页面抖动问题
希望看完文章的你能够带着答案离开。
07-26 4314
【干货分享】解决element弹框组件导致页面抖动问题
vue + Luckysheet 实现在线Excel表格操作
小破孩的博客
07-11 4500
vue + Luckysheet 实现在线Excel表格操作
Excel？最强国产开源在线表格 Luckysheet 走红GitHub！
Oner.wv的专栏
10-20 1764
来源：Python数据科学目前比较流行的办公应用主要有Excel、WPS、石墨文档等等。今天，要和大家推荐一款功能强大、配置简单、完全开源的用纯 JavaScript 编写的前端表格库！...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值