¿Cómo puedo establecer el valor predeterminado para un HTML? <select> Elemento?

¿Cómo puedo establecer el valor predeterminado para un HTML? <select> Elemento?

En el desarrollo web, al hacer un formulario, necesitamos diferentes componentes, como campos de entrada, botones, botones de radio, listas de verificación y muchos más. El menú desplegable es uno de esos componentes que se agrega en un formulario para seleccionar una opción de una lista de menús. Esto se puede hacer en una página web utilizando un elemento HTML que consta de varias opciones especificadas dentro del elemento HTML.

Este estudio demostrará el método para establecer un valor predeterminado para un elemento HTML.

Cómo especificar el valor predeterminado para el elemento HTML?

A veces el "seleccionadoSe debe agregar el atributo para configurar una opción predeterminada. Dentro de la lista desplegable, la opción con el atributo seleccionado se mostrará por defecto.

La sintaxis a continuación muestra cómo hacer de una opción un valor predeterminado:

Mira el ejemplo a continuación para la demostración!

Ejemplo: Configuración del valor predeterminado para el elemento HTML

En HTML, primero, agregue un elemento Div con el nombre de la clase "contenido". Dentro de este elemento:

  • Agregar un elemento de encabezado

    .

  • Entonces, agregue el

    elemento con algo de contenido. El elemento dentro del

    El elemento se utiliza para hacer que el texto sea en negrita.

  • Incluir el HTML ""Elemento con el nombre de los atributos y la identificación.
  • Como hemos discutido anteriormente, el elemento Select contiene las opciones disponibles dentro del menú desplegable. Estas opciones se especifican con el HTML "" elemento.

Por lo tanto, mire el fragmento de código dado a continuación donde se especifica la segunda opción con el atributo "seleccionado"Para definirlo como el valor predeterminado:


Linuxhint


Elija sus publicaciones:



En este caso, "Autor técnico"Se seleccionará y se mostrará como la opción predeterminada:

Vamos a dirigirnos a la sección CSS, donde usaremos diferentes propiedades de estilo CSS para diseñar los elementos HTML.

Estilo "Contenido" Div

.contenido
Ancho: 370px;
Altura: 280px;
borde: 1px Solid #874C62;
margen: auto;
Color de fondo: RGB (34, 32, 32);
relleno: 18px;
Border-Radius: 6px;

El ".contenido"Se utiliza para acceder al elemento HTML Div con el contenido de la clase. La explicación de las propiedades CSS mencionadas anteriormente se enumera a continuación:

  • "ancho"La propiedad ajusta el ancho del elemento.
  • "altura"La propiedad determina la altura del elemento.
  • "borde"La propiedad especifica el borde alrededor del elemento. El valor especifica el ancho del borde, el estilo de borde y el color del borde.
  • "margen"La propiedad especifica la cantidad de espacio alrededor del elemento.
  • "color de fondo"Especifica el color de fondo del elemento.
  • "relleno"Se utiliza para aumentar el espacio alrededor del contenido del elemento.
  • "radio fronterizo"Es la propiedad que hace que las esquinas del elemento reduzcan.

Elemento de estilo "P"

.contenido p
tamaño de fuente: 20px;
Color: #fff;

El

El elemento del contenido DIV tiene las siguientes propiedades:

  • "tamaño de fuente"Establece el tamaño de fuente del elemento.
  • "color"La propiedad ajusta el color de fuente del elemento.

Elemento de estilo "Seleccionar"

seleccionar
relleno: 5px;
Border-Radius: 5px;
Esquema: ninguno;
tamaño de fuente: 18px;

El elemento select se aplica con las siguientes propiedades:

  • "describir"La propiedad especifica un borde o contorno alrededor del elemento, principalmente cuando se selecciona.
  • El "relleno","radio fronterizo", y "tamaño de fuente"Las propiedades realizan funciones como se indicó anteriormente.

Elemento de estilo "H1"

.Contenido H1
Text-Align: Center;
tamaño de fuente: 45px;
Color: #E485B9;

El

El elemento está decorado con las siguientes propiedades:

  • "texto alineado"La propiedad ajusta la alineación del texto del elemento.
  • "tamaño de fuente" y "color"Las propiedades diseñaron el elemento de una manera como se indicó anteriormente.

El siguiente GIF muestra el resultado final del código:

Así es como puede establecer el valor predeterminado para un elemento HTML.

Conclusión

El elemento HTML comprende varios menús que son seleccionables. Estos menús se especifican dentro del elemento HTML. Para establecer el valor predeterminado para un elemento HTML, se requiere especificar el atributo "seleccionado"Para esa opción. Este estudio ha descrito el elemento HTML y el método para establecer su valor predeterminado con un ejemplo práctico.