bootstrap удалить стрелку вверх в раскрывающемся списке

Я использую Twitter bootstap и хочу удалить стрелку вверх в раскрывающемся меню whis в моем nav. Я не могу найти ссылку в загрузчик.стиль CSS.

Bootstrap

.navbar .dropdown-menu:after {
 content: '';
 display: inline-block;
 border-left: 6px solid transparent;
 border-right: 6px solid transparent;
 border-bottom: 6px solid #000; /* change color here, modified for a black arrow */
 position: absolute;
 top: -6px;
 left: 10px;
}

3 ответов


Я бы не рекомендовал вам редактировать . Вы можете перезаписать стиль в пользовательской таблице стилей, чтобы скрыть стрелку для этого компонента следующим образом:

.dropdown-menu:after {
    border: none !important;
    content: "" !important;
}

С помощью этого метода вы даже можете сделать перезапись только для определенного выпадающего списка. Например, если выпадающий список является дочерним элементом элемента с идентификатором my_dropdown, вы могли бы сделать:

#my_dropdown .dropdown-menu:after {
    border: none !important;
    content: "" !important;
}

Это позволит вам иметь стрелку для других выпадающих списков, скрывая ее для этого конкретного раскрывающийся.


для меня работал следующий css:

.dropdown-menu:before, 
.dropdown-menu:after {
     border: none !important;
     content: none !important;
}

Если вы удалите любой из двух селекторов, некоторые детали из Стрелки все равно останутся - либо серый, либо белый треугольник.

(просто решил добавить это в случае, если кто-то ищет ответ позже, так как принятый ответ не работал для меня.)


вы также можете сделать:

.dropdown-menu:before,
.dropdown-menu:after {
  display:none;
}

это отключит стрелку и ее тень.