如何使用自定义字形为菜单项添加下划线

<ul class="menu">
  <li class="menu-item">菜单项1</li>
  <li class="menu-item">菜单项2</li>
  <li class="menu-item">菜单项3</li>
</ul>

@font-face {
  font-family: 'CustomFont';
  src: url('path/to/custom-font.ttf') format('truetype');
}

.menu {
  list-style: none;
  padding: 0;
}

.menu-item {
  font-family: 'CustomFont', Arial, sans-serif;
  font-size: 16px;
  color: #000;
  position: relative;
}

.menu-item::after {
  content: '\uXXXX'; /* 替换为自定义字形的Unicode编码 */
  position: absolute;
  bottom: -2px; /* 下划线位置调整 */
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #000; /* 下划线颜色 */
}