electron自定义顶部导航栏(滚动条的问题)

发布网友发布时间：2024-10-01 10:13

共1个回答

热心网友时间：2024-10-13 01:20

先隐藏默认标题栏：

然后直接在App.vue中编写顶部导航栏样式。

使用scss定义样式如下：

实现一个基础的顶部导航栏。

然而，面临一个问题：当页面需要滚动时，滚动条会出现在最右侧，尝试多种解决方案均未成功。

接着找到了一个有效方法：

首先自定义导航栏样式，如代码所示。

通过复制粘贴实现，当前界面为：

为解决滚动条问题，为滚动条的（::-webkit-scrollbar-track）元素设置margin-top，使其高度与导航栏一致。

同时，为整个滚动条最外层元素（::-webkit-scrollbar）设定与导航栏相同的颜色。

最后，将（::-webkit-scrollbar-track）滚动轴背景颜色调整为与主页面一致，如白色。

最终效果如上。