Hacer un elemento HTML transparente (CSS opacity)

Hacer un elemento HTML transparente es algo muy útil cuando por ejemplo deseas que el usuario vea un area de escritira muy atractiva cuando en realidad va a usar un simple: . La solución viene del lado de CSS, pero como siempre hay problemas entre browsers, y siguiendo las recomendaciones del mozilla developer center presentó lo siguiente:

Digamos que quiero que un DIV sea transparente, entonces se deberá crear la siguiente regla CSS para lograr eso tanto para FireFox como para IE.

div.transp { /* make the div translucent */
opacity: 0.6;
filter: "alpha(opacity=60)"; /* expected to work in IE 8 */
filter: alpha(opacity=60);   /* IE 4-7 */
zoom: 1;                     /* needed in IE up to version 7, or set width or height to trigger "hasLayout" */
}

Así de simple se logra transformar un DIV normal en un DIV semi-transparente para FF y IE.

Referencias:

• Opacity MDC
• Opacity MSDN
• Referencia CSS