将下拉菜单设为滚动效果

将下拉菜单设为滚动效果需要以下步骤：

1. 设置下拉菜单容器的高度。

.el-dropdown-menu {
  max-height: 200px; /*设置菜单高度为200px*/
  overflow-y: auto; /*设置滚动条*/
}

.

1. 在下拉菜单容器中添加内容，并使其超出容器高度。

<div class="el-dropdown-menu">
  <ul>
    <!-- 这里添加下拉菜单内容 -->
  </ul>
</div>

1. 针对滚动条的样式进行自定义。

 

.el-dropdown-menu::-webkit-scrollbar {
  width: 6px; /*滚动条宽度*/
}

.el-dropdown-menu::-webkit-scrollbar-thumb {
  background-color: #c1c1c1; /*滚动条颜色*/
  border-radius: 5px; /*滚动条边角弧度*/
}

以上是将下拉菜单设置成滚动效果的基本步骤。可以根据实际需求调整滚动条的宽度、颜色和边角弧度等样式，实现更加个性化的效果。

需要注意的是，滚动条仅在下拉菜单内容超出容器高度时才会显示，如果没有超出高度，滚动条不会显示。此外，在某些浏览器中，滚动条可能不会起作用，这时需要更改滚动条的样式或者使用其他方案来解决问题。