CSS для опции выбора для прозрачного фона

У меня есть веб-страница с фоновым изображением. После этого есть поле со списком для фильтрации некоторого контента. Я хочу, чтобы этот флажок опции выбора был прозрачным. Я прочитал много результатов в Google, чтобы использовать опцию select в CSS, но это не сработало. Я создаю скрипку здесь: http://jsfiddle.net/25CQE/5 For example, и, как видите, фон опции не прозрачен. Итак, любая идея, как решить это? Или это невозможно сделать с помощью CSS?

Извините за мой плохой английский

Ответы

Ответ 1

Если вы хотите сделать его полностью прозрачным, используйте

select {
    border: 1px solid #fff;
    background-color: transparent;
}

Demo

Если вы хотите иметь полупрозрачный цвет фона, вы можете использовать rgba(), где a обозначает альфа

select {
    border: 1px solid #fff;
    background-color: rgba(255,255,255,.5);
    padding: 5px;
}

Demo 2

Ответ 2

Просто добавьте

select {background:transparent;}

- редактировать дополнительные -

Вы не сможете настроить параметры, потому что они берут стиль из os или браузера. Вы можете попробовать javascript-решение для более удобных элементов формы, таких как http://uniformjs.com/ - тогда вы могли бы использовать прозрачное изображение, возможно,

Ответ 3

вы можете изменить цвет для опции выбора в файле или стиле css, следующим образом:

select option {
    background-color: transparent; 
}

или для основного входа выбора

select {
    background-color: transparent; 
}

демо

Ответ 4

попробуйте это:

body 
{
background: #82caff;
}

select {
    padding: 5px;
    color: #000;
    font-size: 12px;
    background: transparent;
    -webkit-appearance: none;

}
select option{
background-color: #82caff;
}

<select id="nname">
  <option value="volvo">Volvo</option>
  <option value="peugeot">peugeot</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>