Tecnología

Inicio

Cómo cambiar el color de una lista desplegable

July 30

La lista desplegable es una parte importante de muchas formas basadas en la Web, ya que permite al usuario del sitio web para elegir de una lista compacta de opciones definidas por el programador web. Si desea dar a sus listas desplegables un poco de estilo, puede intentar cambiar la propiedad CSS "background-color" de cada opción de la lista o la lista desplegable. Cambiando el color de fondo de las opciones específicas, puede agrupar opciones similares. Un cambio de estilo como este puede ayudar a los usuarios a encontrar la opción de lista desplegable que están buscando más rápido.

Instrucciones

1 Abrir un documento de página Web en un editor HTML o texto. Para abrir un documento de página web utilizando su editor de texto predeterminado, haga clic en el documento, haga clic en "Abrir con". Haga clic para seleccionar "Bloc de notas" o "WordPad", a continuación, haga clic en "Aceptar".

2 Haga clic para colocar el cursor en una línea en blanco entre el "<form>" y "</ form>" etiquetas que constituyen el principio y el final de su formulario web. Si no desea crear la lista desplegable, como parte de un formulario en línea, haga clic para colocar el cursor en una línea en blanco entre el "<body>" y "</ body>" etiquetas, en un punto en la web documento de página en la que desea crear la lista desplegable.

3 Tipo "<select size =" 1 "style = 'background-color: [colorvalue];"> "y pulse" Enter "para abrir la etiqueta de lista desplegable. Reemplazar el texto "[colorvalue]" en la propiedad "background-color" con un valor hexadecimal del color, tales como "#ffffff" para el blanco o "# ff0000" para el rojo. Esto cambiará el valor del color de fondo para toda la lista desplegable, pero este valor puede ser modificado mediante la especificación de un valor de color de fondo para una opción individual en la lista desplegable.

4 Tipo "<option value = '[ValorDeLaOpción]' style = 'background-color: [colorvalue];"> Opción de valor </ option> "y pulse" Enter "para crear un valor de opción. Reemplazar el texto "[ValorDeLaOpción]" con el valor de la opción, que es un valor singular forma que será utilizado en el tratamiento de la forma. Reemplazar el texto "[colorvalue]" con un valor hexadecimal de color para cambiar el color de fondo de esta opción única.

5 Repita el paso anterior para crear opciones adicionales en la lista desplegable. Cada opción se puede configurar para utilizar un color de fondo diferente. Cualquier opción sin un color de fondo definido revertirán al color de fondo definido en la etiqueta "<select>" en el paso 3.

6 Tipo "</ select>" para cerrar la etiqueta de lista desplegable.

7 Haga clic en el menú "Archivo" en el código HTML o editor de texto, a continuación, haga clic en "Guardar".