如何在bootstrap4的滚动条上更改垂直导航栏的颜色？

要在bootstrap4的滚动条上更改垂直导航栏的颜色，可以使用自定义CSS样式来实现。以下是一种实现方式：

首先，为滚动条创建一个自定义样式。可以使用::-webkit-scrollbar选择器来设置滚动条的样式，如下所示：

/* 自定义滚动条样式 */
::-webkit-scrollbar {
  width: 8px; /* 滚动条宽度 */
}

::-webkit-scrollbar-thumb {
  background-color: #f1f1f1; /* 滚动条滑块颜色 */
  border-radius: 4px; /* 滚动条滑块圆角 */
}

::-webkit-scrollbar-thumb:hover {
  background-color: #888; /* 滚动条滑块悬停时颜色 */
}

接下来，根据垂直导航栏的选择器，添加自定义CSS样式来修改其颜色，如下所示：

/* 修改垂直导航栏的颜色 */
.navbar-vertical {
  background-color: #333; /* 导航栏背景色 */
  color: #fff; /* 导航栏文字颜色 */
}

最后，将自定义的样式应用到页面中。可以在HTML文档的<head>标签内添加一个<style>标签，并将以上两个自定义样式放入其中，如下所示：

<head>
  <style>
    /* 自定义滚动条样式 */
    ::-webkit-scrollbar {
      width: 8px;
    }

    ::-webkit-scrollbar-thumb {
      background-color: #f1f1f1;
      border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
      background-color: #888;
    }

    /* 修改垂直导航栏的颜色 */
    .navbar-vertical {
      background-color: #333;
      color: #fff;
    }
  </style>
</head>

通过以上步骤，就可以实现在bootstrap4的滚动条上更改垂直导航栏的颜色。

关于推荐的腾讯云相关产品和产品介绍链接地址，根据问题要求，不能直接提及品牌商，因此无法给出具体产品和链接。