Loading

Transparencias en CSS3

Pruebas del uso de tranparencias con CSS3

Color de fondo

Esto es el texto del bloque sin transparencias
Esto es el texto del bloque con transparencia del 25%
Esto es el texto del bloque con transparencia del 50%
Esto es el texto del bloque con transparencia del 75%
Esto es el texto del bloque con transparencia del 100%

Color de letra

Este es un texto con las letras sin transparencia
Este es un texto con las letras con transparencia del 25%
Este es un texto con las letras con transparencia del 50%
Este es un texto con las letras con transparencia del 75%

Código HTML

Color de fondo

Esto es el texto del bloque sin transparencias
Esto es el texto del bloque con transparencia del 25%
Esto es el texto del bloque con transparencia del 50%
Esto es el texto del bloque con transparencia del 75%
Esto es el texto del bloque con transparencia del 100%

Color de letra

Este es un texto con las letras sin transparencia
Este es un texto con las letras con transparencia del 25%
Este es un texto con las letras con transparencia del 50%
Este es un texto con las letras con transparencia del 75%

Código CSS

.bloqueNormal {
	color: rgb(200, 200, 200);
	background-color: rgb(100, 100, 100);
	border: 2px solid rgb(100,100,100);
	margin-bottom: 2%;
}

.bloqueTransparenteBajo {
	color: rgb(200, 200, 200);
	color: rgba(200, 200, 200, 1);
	background-color: rgb(100, 100, 100);
	background-color: rgba(100, 100, 100, 0.75);
	border: 2px solid rgb(100,100,100);
	margin-bottom: 2%;
}

.bloqueTransparenteMedio {
	color: rgb(200, 200, 200);
	color: rgba(200, 200, 200, 1);
	background-color: rgb(100, 100, 100);
	background-color: rgba(100, 100, 100, 0.5);
	border: 2px solid rgb(100,100,100);
	margin-bottom: 2%;
}

.bloqueTransparenteAlto {
	color: rgb(200, 200, 200);
	color: rgba(200, 200, 200, 1);
	background-color: rgb(100, 100, 100);
	background-color: rgba(100, 100, 100, 0.25);
	border: 2px solid rgb(100,100,100);
	margin-bottom: 2%;
}

.bloqueTransparenteTotal {
	color: rgb(200, 200, 200);
	color: rgba(200, 200, 200, 1);
	background-color: rgb(100, 100, 100);
	background-color: rgba(100, 100, 100, 0);
	border: 2px solid rgb(100, 100, 100);
	margin-bottom: 2%;
}

.letraNormal {
	color: rgb(0, 0, 0);
	color: rgba(0, 0, 0, 1);
	margin-bottom: 2%;
}

.letraTransparenteBajo {
	color: rgb(0, 0, 0);
	color: rgba(0, 0, 0, 0.75);
	margin-bottom: 2%;
}

.letraTransparenteMedio {
	color: rgb(0, 0, 0);
	color: rgba(0, 0, 0, 0.5);
	margin-bottom: 2%;
}

.letraTransparenteAlto {
	color: rgb(0, 0, 0);
	color: rgba(0, 0, 0, 0.25);
	margin-bottom: 2%;
}

					
contacto | licencia