Javascript 如何将下拉箭头移动到顶部？

我正在使用icomoon的图标。我想为用户设置一个下拉菜单。它可以工作，但问题是箭头按钮正在向下移动。是否可以将箭头按钮保持在顶部（我的意思是靠近图标的头部）。请查看屏幕截图

这是我的导航条码

<nav class="navbar navbar-custom navbar-static-top">
<div class="container">
  <div class="navbar-header">
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
      <span class="sr-only">Toggle navigation</span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
      <span class="icon-bar"></span>
    </button>
    <a class="navbar-brand" href="#"></a>
  </div>
  <div class="collapse navbar-collapse">
    <ul class="nav navbar-nav">
      <li class="active"><a href="#"></a></li>
      <li><a href="#">D</a></li>
      <li><a href="#">E</a></li>
    </ul>

    <ul class="nav navbar-nav navbar-right">
      <li><a href="#" class="icon-store"></a></li>
      <li class="dropdown">
        <a href="#" class="dropdown-toggle icon-user2" data-toggle="dropdown" > <b class="caret"></b></a>
        <ul class="dropdown-menu pull-right">
          <li><a href="#">Action</a></li>
          <li><a href="#">Another action</a></li>
          <li><a href="#">Something else here</a></li>
          <li><a href="#">Separated link</a></li>
        </ul>
      </li>
    </ul>
  </div><!-- /.navbar-collapse -->
  </div>
</nav>

---

您可以使用垂直对齐属性，该属性在所有主要浏览器中都受支持

---

要使箭头与顶部对齐，请使用

.caret{vertical align:top；}

或使用其他值查看是否可以获得所需效果。这里列出了可能的值：

试试这个：

• 垂直对齐：文本顶部
• 垂直对齐：文本底部对齐
• 垂直对齐：中间对齐
• 垂直对齐：顶部

如果要更改

.caret

大小，必须更改声明的三个边框大小。因为它不是一个图标，所以是一个用CSS（）制作的三角形：

---

将

4px

更改为您想要的任何格式。

.caret{vertical align:top；}

这就是你想要的？我想这可能与线条高度有关…或者图标设置不好。你能告诉我如何增加图标的大小吗？如果我使用垂直对齐：顶部，它看起来就像箭头指向顶部，图标向下。我想如果我折皱图标，它看起来会很好。你可以使用“字体大小”若要更改图标的大小，您可以更改大小或使用“垂直对齐”设置元素的垂直对齐方式

border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 4px solid;