0

Мне нужен css с полностью прозрачным фоном, однако если сам элемент select этому поддаётся, то option нет. Ему можно поставить любой цвет, но если изменить прозрачность, то вместо этого появляется стандартный белый блок, как я могу это исправить?

1
  • Приведите, пожалуйста, свой код Commented 27 авг. 2023 в 15:54

1 ответ 1

2

Это можно сделать с помощью JQuery

 $( function() {
    $( "#speed" ).selectmenu();
  } );
body{
  background-color: #225226;
}

.ui-widget-content{
  background-color: transparent !important;
}
<head>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css">
  <script src="https://code.jquery.com/jquery-3.6.0.js"></script>
  <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
</head>
<body>
    <select name="speed" id="speed">
      <option>Slower</option>
      <option>Slow</option>
      <option selected="selected">Medium</option>
      <option>Fast</option>
      <option>Faster</option>
    </select>
</body>

Конечно, слишком, использовать JQuery для таких задач, но если очень хочется, то почему бы и нет.

3
  • 1
    Вовсе даже не слишком - отличное решение. jquery-ui для подобных задач как раз и создавался. На чистом css стилизовать option нельзя. Commented 7 сент. 2023 в 9:36
  • @humster_spb Можно стилизовать option, но там куча ограничений, что в целом не позволяет работать нормально Commented 7 сент. 2023 в 11:50
  • А есть ли такой же вариант на React JS?
    – Zoom
    Commented 7 сент. 2023 в 13:58

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.