más que HTML desarrollo web con estándares
Transparencias en CSS3
Con CSS3, disponemos de 2 propiedades para modificar la transparencia de un elemento: opacity y background: rgba
Opacity
Puede tomar valores entre 0 (totalmente transparente) y 1 (totalmente opaco). El valor de esta propiedad se propaga a los hijos del elemento en cuestión.
opacity: 0.5;
Internet Explorer no soporta esta propiedad, pero podemos obtener el mismo resultado con un filtro propietario.
Degradados lineares sin imágenes
Con la salida de la versión 3.6 de Firefox, los principales navegadores (Firefox, Safari e Internet explorer) ya soportan propiedades para hacer degradados lineares sin imágenes. Además, Google Chrome, al estar basado en Webkit, como Safari, es muy probable que lo haga próximamente.
En los navegadores basados en Gecko y Webkit, podemos hacer degradados con varios colores, en cualquier ángulo e incluso radiales. Lamentablemente, Internet explorer sólo permite degradados lineares entre dos colores, así que vamos a centrarnos en ese caso.
Mostrar siempre las barras de desplazamiento
Si nos encontramos ante una web centrada horizontalmente, y pasamos de una página sin scroll vertical a otra que sí lo tiene (o viceversa), se produce un pequeño salto en la alineación. Al aparecer la barra de desplazamiento, el área de visualización del navegador se reduce y, por tanto, el centro se desplaza unos píxeles, lo que provoca ese salto en la alineación de la web.
Ocurre en todos los navegadores actuales, a excepción de Internet Explorer 6 y 7 que siempre muestran la barra de desplazamiento (cuando no hay scroll, aparece inactiva). Este comportamiento es que el podemos recrear en el resto de navegadores para evitar esos pequeños saltos. De la siguiente manera:
body { overflow-y: scroll; }
Comprobado en Internet Explorer 8, Opera 10.10, Safari 4.0.4, Google Chrome 3.0 y Firefox 3.5.5
Además, aunque la propiedad overflow-y no es válida para CSS 2.1, sí lo es para CSS 3.
Frameworks de desarrollo rápido de CSS
Los frameworks CSS más conocidos, como Blueprint, YUI o 960, nos proporcionan una serie de clases con estilos predefinidos que podemos aplicar. En cambio existen otros frameworks CSS enfocados en simplificar y agilizar el desarrollo de nuestras propias hojas de estilo.
Algunos de ellos son:
Combinar clases en los selectores CSS
Según el estándar, en los selectores de CSS podemos combinar varias clases, por ejemplo:
.clase1.clase2 {} //No funciona en Internet Explorer 6 e inferiores
Este selector sólo afectará a los elementos que tengan todas las clases.
Incluso podemos combinarlo con un selector por id:
#identificador.clase1.clase2 {} //Funciona a partir de Internet Explorer 4
Esto puede ser una herramienta muy potente a la hora de trabajar con nuestras hojas de estilos.