如何在小屏幕的cssbootstrap附加菜单中添加垂直自动滚动条？

在小屏幕的CSS Bootstrap附加菜单中添加垂直自动滚动条，可以通过以下步骤实现：

1. 首先，确保你已经引入了Bootstrap的CSS和JavaScript文件。
2. 在HTML中创建一个菜单容器，可以使用<div>元素，并为其添加一个唯一的ID，例如menu-container。
3. 在菜单容器中创建一个列表，使用<ul>元素，并为其添加一个唯一的ID，例如menu-list。
4. 在列表中添加菜单项，使用<li>元素，并为每个菜单项添加相应的内容。
5. 在CSS中，为菜单容器设置固定的高度，并为其添加overflow-y: auto;样式，以实现垂直滚动条。例如：

#menu-container {
  height: 300px;
  overflow-y: auto;
}

1. 在JavaScript中，使用Bootstrap的scrollspy插件来实现滚动条的自动激活。首先，确保你已经引入了Bootstrap的JavaScript文件。然后，通过以下代码来初始化scrollspy插件：

$('#menu-container').scrollspy({ target: '#menu-list' });

1. 最后，在菜单容器中添加菜单项的data-target属性，以与scrollspy插件关联。例如：

<div id="menu-container">
  <ul id="menu-list" data-spy="scroll" data-target="#menu-container">
    <li data-target="#section1">菜单项1</li>
    <li data-target="#section2">菜单项2</li>
    <li data-target="#section3">菜单项3</li>
    <!-- 其他菜单项 -->
  </ul>
</div>

这样，你就可以在小屏幕的CSS Bootstrap附加菜单中添加垂直自动滚动条了。当菜单项超出菜单容器的高度时，会自动显示垂直滚动条，并且滚动条会根据页面滚动自动激活相应的菜单项。