4.5 Formulario

El formulario es un elemento que aparece frecuentemente en cualquier página web. En el tema pasado estudiamos los campos HMTL que podía formar parte de un formulario básico. En este punto aprenderemos a añadir un estilo profesional al formulario.  Encontrarás  más ejemplos en la web w3school.

¡Veamos un ejemplo! En la izquierda aparece el código HTML de un formulario con tres campos de entrada y un botón de envío. Este formulario no tiene estilos asociados y si lo ejecutas en un navegador obtendrás el resultado que se aprecia en la imagen de la derecha. ¿Cómo podemos mejorar su apariencia?

font
Imagen  código HTML formulario sin estilo de creación propia  
font
Imagen de ejecución en le navegador del código HTML sin estilo de creación propia 

En primer lugar debemos asociar el código HTML a una hoja de estilos (CSS) en ella definiremos las propiedades que ves en la imagen de la izquierda. Todas las propiedades las hemos estudiado en este tema, la principal novedad es como se indica en CSS a qué tipo de campo (input) nos estamos refiriendo.

font
Imagen  código  CSS  (formulario) de creación propia  
font
Imagen de ejecución en le navegador del código HTML vinculado a la hoja de estilo de creación propia