css竖排下拉菜单 |scrollbar- css

HTML代码：
 <ul class="dropdown-menu"><li><a href="#">菜单1</a></li><li><a href="#">菜单2</a></li><li><a href="#">菜单3</a></li></ul>CSS代码：
 .dropdown-menu{
list-style:none;
margin:0;
padding:0;
width: 120px;
position: relative;
 }
 .dropdown-menu li{
position: relative;
 }
 .dropdown-menu li a{
display:block;
padding:5px 10px;
color:#fff;
text-decoration:none;
background-color:#333;
 }
 .dropdown-menu li a:hover{
background-color: #666;
 }
 .dropdown-menu ul{
display:none;
position: absolute;
top:0;
left:100%;
padding:0;
margin:0;
z-index:99;
 }
 .dropdown-menu li:hover ul{
display:block;
 }
 .dropdown-menu ul li{
float:none;
display:block;
 }

首先，大家使用ul标签创建下拉菜单，li标签创建菜单选项。竖排菜单的宽度通过CSS进行设置，同时应该还设置菜单项与菜单之间的间距。通过设置position属性，可以使下拉菜单在正确的位置弹出。下拉菜单中的每一个选项通过A标签进行创建。当鼠标悬停在选项上时，大家可以使用:hover属性来修改选项的样式，从而使网站界面更具交互性。

请注意，以上代码仅提供了基本的CSS竖排下拉菜单的实现方法，还可以根据需要对其进行扩展和优化。