цвет выделения при клике DropdownMenu Bootstrap 4

Рейтинг: 0Ответов: 1Опубликовано: 12.06.2023

При клике на элемент выпадающего меню он выделяется синим , как изменить этот цвет?

import Dropdown from 'react-bootstrap/Dropdown';
import DropdownButton from 'react-bootstrap/DropdownButton';

function ButtonDarkExample() {
  return (
    <>
      <Dropdown>
        <Dropdown.Toggle id="dropdown-button-dark-example1" variant="secondary">
          Dropdown Button
        </Dropdown.Toggle>

        <Dropdown.Menu variant="dark">
          <Dropdown.Item href="#/action-1" active>
            Action
          </Dropdown.Item>
          <Dropdown.Item href="#/action-2">Another action</Dropdown.Item>
          <Dropdown.Item href="#/action-3">Something else</Dropdown.Item>
          <Dropdown.Divider />
          <Dropdown.Item href="#/action-4">Separated link</Dropdown.Item>
        </Dropdown.Menu>
      </Dropdown>

      <DropdownButton
        id="dropdown-button-dark-example2"
        variant="secondary"
        menuVariant="dark"
        title="Dropdown button"
        className="mt-2"
      >
        <Dropdown.Item href="#/action-1" active>
          Action
        </Dropdown.Item>
        <Dropdown.Item href="#/action-2">Another action</Dropdown.Item>
        <Dropdown.Item href="#/action-3">Something else</Dropdown.Item>
        <Dropdown.Divider />
        <Dropdown.Item href="#/action-4">Separated link</Dropdown.Item>
      </DropdownButton>
    </>
  );
}

export default ButtonDarkExample;
bootstrap bootstrap4
Источник: Stack Overflow на русском

Ответы

▲ 0Принят

Нашел ответ , может кому полезно будет. Нужно подключить CSS таблицу стилей и в нее добавить код:

    .dropdown-item:focus,
    .dropdown-item:active {
    outline: none;
    box-shadow: none;
    background-color: black;
                          }

background-color это и есть тот самый цвет выделения.