如何使用 CSS 设置下拉菜单的样式？

下拉菜单是网页常见的交互元素，我们可以使用 CSS 设置它的样式。下面是一些常用的设置方式：

1. 使用 CSS 选择器选择下拉菜单的元素

/* 选择 class 名为 dropdown 的下拉菜单 */
.dropdown {
  /* 设置样式 */
}

2. 设置下拉菜单的宽度和高度

/* 设置下拉菜单的宽度为 200px */
.dropdown {
  width: 200px;
}

/* 设置下拉菜单的高度为自适应 */
.dropdown {
  height: auto;
}

3. 设置下拉菜单的背景色和字体颜色

/* 设置下拉菜单的背景为白色，字体颜色为黑色 */
.dropdown {
  background-color: #ffffff;
  color: #000000;
}

4. 使用 CSS 伪类设置下拉菜单的悬停样式

/* 设置下拉菜单悬停时背景为蓝色，字体颜色为白色 */
.dropdown:hover {
  background-color: #0000ff;
  color: #ffffff;
}

5. 设置下拉菜单的边框

/* 设置下拉菜单的边框为 1px 灰色实线 */
.dropdown {
  border: 1px solid #cccccc;
}

6. 设置下拉菜单的阴影

/* 设置下拉菜单的阴影为 2px 2px 5px 灰色 */
.dropdown {
  box-shadow: 2px 2px 5px #888888;
}

以上是一些常用的下拉菜单样式设置方法，开发者可以根据需要自由搭配使用。