[分享]css做下拉菜单文字居中

CSS做下拉菜单文字居中时，我们通常需要考虑以下几种情况。

/* 情况一：下拉菜单列表项固定宽度 */

.dropdown-menu {
  width: 150px;
}

.dropdown-menu li {
  width: 100%; /* 让每个列表项都占满整个宽度 */
  text-align: center; /* 让文本居中 */
}

/* 情况二：下拉菜单列表项宽度不固定 */

.dropdown-menu li {
  display: flex;
  justify-content: center; /* 让文本居中 */
} 

以上代码中，我们通过设置下拉菜单的宽度或者使用flex布局来使得文本居中。

需要注意的是，在情况一中，如果下拉菜单的宽度不固定，其中的列表项可能会出现换行，这时可以使用情况二中的方法解决。

妥善使用CSS，可以轻松实现下拉菜单文字居中的效果。