Aplicar estilo a los inputs de los formularios

Aplicar estilos a los inputs o campos de texto de un formulario es posible utilizando CSS.

En el ejemplo que ilustramos en este ejemplo, aplicamos estilos a un campo simple de texto, un selector de opciones y un campo textarea.

Se podría hacer de muchas formas pero una de ellas es tener el siguiente código CSS:

input.text, select.text, textarea.text {
   background: silver;
   border: 1px solid #393939;
   border-radius: 5px 5px 5px 5px;
   color: #393939;
   font-size: 12px;
   padding: 5px;
}

Estamos aplicando estilos a los campos del formulario de tipo input, select y textarea situándole un class=»text» en cada uno de ellos como se ve a continuación:

<input type="text" name="username" class="text" /><br/><br/>
<select class="text">
    <option value="0">España</option>
    <option value="1">Portugal</option>
    <option value="2">Francia</option>
</select><br/><br/>
<textarea cols="100" rows="8" class="text"></textarea>