Formulario

4

Click here to load reader

Transcript of Formulario

Page 1: Formulario

1-Vamos a empezar con una estructura HTML base y guardamos este archivo como index.html:

2-Creamos una hoja de estilos, le ponemos de nombre estilos.css y la ubicamos en la misma

carpeta en donde está el .HTML

El siguiente código define las propiedades de fuente, color de fondo y longitud del body:

Page 2: Formulario

3-Hacemos un selector para el formulario y le definimos border, border-radius, padding, margin, y

color de fondo:

4-En la línea 17 estamos definiendo dos sombras: una externa y otra interna que da la apariencia

de un borde interior.

Page 3: Formulario

5-Para las cajas de textos usamos selectores múltiples, para los input y para el text área:

*Nota que en la línea 26 y 34 se usa el selector input[type=’text’] esto es para que no se mezcle con

el otro input[type=’submit’].

6-Por ultimo para el botón de envió usaremos estilos similares a los de las cajas de textos, pero

además va a tener bordes redondeados, sombra al texto y para el background le pondremos

degradados CSS3:

Page 4: Formulario

EL RESULTADO FINAL ES ESTE: