Dale estilo a los inputs de tus formularios de contacto o de registro

Si deseas crear un Formulario de Contacto o de Registro que se vea mejor la primer opción sería darle estilo a los inputs.
En tu css sólo debes de poner los estilos que deseas para esa etiqueta, por ejemplo:
input{
border: #ccc 1px solid;
height: 25px;
width: 200px;
color: #ccc;
}

Si no quieres que se aplique a todos los inputs de tu sitio web, crea un div que encierre tu formulario y estiliza unicamente los inputs de ahi dentro de la siguiente forma:
.contacto input{
 /*estilos aqui*/ 
} 
donde .contacto es el estilo del div que encierra el form.
También puedes darle estilo al nombre del campo, poniéndolo dentro de un .

En total tendríamos este html:

<div class="contacto">
  <span class="campo">Nombre:</span><input name="" type="text" /><br />
  <span class="campo">E-mail:</span><input name="" type="text" /><br />
  <span class="campo">Asunto:</span> <input name="" type="text" />
</div>

y este css:

.contacto{
font-family:Verdana, Geneva, sans-serif;
color:#39C;
font-size:11px;
}
.contacto input {
border: #39C 1px dashed;
height: 25px;
width: 200px;
color: #777;
margin:5px;
}
.campo{
display:block;
float:left;
line-height:25px;
height:25px;
width:100px;
text-align:right;
margin:5px;
}

Y ese código nos da esto:

Nombre:
E-mail:
Asunto:

Le puedes agregar border-radius box-shadow y demás para que se vea aún mejor, ya es cuestión de cada quien. Además, de la misma forma puedes darle estilo a los text-area.

Si profundizamos un poco más y usamos un poco de jQuery podemos obtener lo siguiente para ahorrar espacio, colocando el nombre del campo dentro del input y haciéndolo desaparecer al teclear dentro de él:

Este sería el html:

<div class="contacto">
  <input name="" type="text" placeholder="Nombre:"/><br />
  <input name="" type="text" placeholder="E-mail:"/><br />
  <input name="" type="text" placeholder="Asunto:"/>
</div>


Y este es el script:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
  <script>
  // This adds 'placeholder' to the items listed in the jQuery .support object.
  jQuery(function() {
jQuery.support.placeholder = false;
test = document.createElement('input');
if('placeholder' in test) jQuery.support.placeholder = true;
});
// This adds placeholder support to browsers that wouldn't otherwise support it.
$(function() {
if(!$.support.placeholder) {
var active = document.activeElement;
$(':text').focus(function () {
if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {
$(this).val('').removeClass('hasPlaceholder');
}
}).blur(function () {
if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {
$(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');
}
});
$(':text').blur();
$(active).focus();
$('form:eq(0)').submit(function () {
$(':text.hasPlaceholder').val('');
});
}
});
</script>




Espero le sirva a alguien xD

(El script lo saqué de aqui: http://www.cssnewbie.com/example/placeholder-support/)