web-dev-qa-db-fra.com

CSS pour que l'option choisie soit un fond transparent

J'ai une page Web qui contient une image de fond. Après cela, il y a une liste déroulante pour filtrer du contenu. Je veux créer cet arrière-plan select - option transparent. J'ai lu de nombreux résultats sur Google pour utiliser l'option de sélection sur CSS, mais cela n'a pas fonctionné. J'ai créé un violon ici: http://jsfiddle.net/25CQE/5For example et, comme vous pouvez le constater, l’arrière-plan de l’option n’est pas transparent. Alors, aucune idée de comment résoudre ce problème? Ou cela ne peut pas être fait par CSS?

Désolé pour mon mauvais anglais

htmlcsscombobox
9
Cross Vander

Si vous voulez le rendre totalement transparent, utilisez

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

Demo

Si vous souhaitez une couleur d'arrière-plan semi-transparente, vous pouvez utiliser rgba() où a signifie alpha .

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

Demo 2

6
Mr. Alien

Il suffit d'ajouter

select {background:transparent;}

--edit supplémentaire -

Vous ne pourrez pas styliser les options, car celles-ci reprennent le style du système d'exploitation ou du navigateur. Vous pouvez essayer une solution javascript pour des éléments de formulaire plus agréables, tels que http://uniformjs.com/ -. Vous pouvez ensuite utiliser une image transparente, par exemple.

0
b_uk_happy

vous pouvez modifier la couleur de l'option de sélection sur le fichier css ou le style, de la manière suivante:

select option {
    background-color: transparent; 
}

ou pour l'entrée de sélection principale 

select {
    background-color: transparent; 
}

démo

0
3p3ch3