Cómo cambiar el color de la opción seleccionada usando CSS

Como Cambiar El Color De La Opcion Seleccionada Usando Css



Las opciones se dan al usuario cuando existen múltiples valores de un solo elemento, desde donde los usuarios pueden seleccionar una opción de acuerdo a sus preferencias. Existe en diferentes formas, como una casilla de verificación, un menú desplegable y un botón de opción. Más específicamente, el menú desplegable proporciona listas predefinidas de opciones que permiten al usuario seleccionar una.

Este manual explicará el procedimiento para modificar el color de la opción seleccionada. Para esto, primero, crearemos un menú desplegable y le daremos estilo usando CSS y luego cambiaremos el color de la opción seleccionada.







¡Empecemos!



¿Cómo crear un menú desplegable usando HTML y CSS?

En HTML, puede crear un menú desplegable usando ' ”, “ ' y ' ” etiquetas. Para entender más claramente, pasemos a la sintaxis del menú desplegable.



Sintaxis





Esta es la sintaxis del menú desplegable:

< etiqueta > Texto etiqueta >
< Seleccione >
< opción valor = '' > Opción 1 opción >
< opción valor = '' > opcion 2 opción >

...
< opción valor = '' > opciónN opción >
Seleccione >



Expliquemos las etiquetas HTML utilizadas en la sintaxis anterior:

  • : Se utiliza para especificar la opción abreviada en forma de texto.
  • : Este elemento permite al usuario seleccionar un elemento de una lista.
  • : Se utiliza para proporcionar opciones para el menú desplegable.

 

Aquí presentamos un ejemplo práctico para explicar la sintaxis anterior.

Paso 1: crea un menú desplegable

Primero, crearemos un

y agregaremos un encabezado usando la etiqueta

. Para agregar un menú desplegable dentro de él, usaremos una etiqueta de etiqueta y agregaremos ' Elige un país ” como la etiqueta. Después de eso, usaremos la etiqueta