时间戳

首页 > 解决方案 > 从 ngbDropdownToggle 中删除小箭头

ng-bootstrap - 从 ngbDropdownToggle 中删除小箭头

问题描述

如何从ngbDropdownToggleng-bootstrap 中删除/隐藏图标右侧的小箭头？

跟随示例：https ://ng-bootstrap.github.io/#/components/dropdown/examples

我的代码：

<ul class="navbar-nav ml-1">
  <li ngbDropdown class="nav-item">
    <a class="nav-link" ngbDropdownToggle>
      <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-three-dots-vertical" viewBox="0 0 16 16">
        <path d="M9.5 13a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0zm0-5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/>
      </svg>
    </a>
  </li>
</ul>

谢谢你。

标签： ng-bootstrap

解决方案

首先使用 ngbDropdownToggle 向元素添加自定义类或 id。比你可以添加这个CSS。

.custom-class-or-id:after {
    content: none !important;
}

这将删除 ,,auto-added'' 箭头图标。

推荐阅读