Autor Tema: HTML y CSS diferencia entre colores RGB, RGBA, hexadecimal, hsl, hsla CU01021D (Leído 3005 veces)

Lorenzo31 · « **en:** 14 de Febrero 2016, 16:43 »

Buenas, aquí dejo mi solución del ejercicio CU01021D del curso CSS.

<!DOCTYPE html>
<html>
	<head> 
		<meta charset="utf-8"/> 
		<link rel="stylesheet" type="text/css" href="estilos121D.css"/>
	</head>
	<body>
		<div class="primera"><span>División 1: un color expresado con notación RGB. COLOR: 210,200,100</span></div>
		<div class="segunda">División 2: un color expresado con notación RGBA. COLOR: 100,255,100,0.5</div>
		<div class="tercera">División 3: un color expresado con notación HEXADECIMAL. COLOR: #F0FFFF; </div>
		<div class="cuarta">División 4: un color expresado con notación HSL. COLOR: 50,70%,70% </div>
		<div class="quinta">División 5: un color expresado con notación HSLA. COLOR: 150,35%,30%,0.8 </div>
		<div class="sexta">División 6: un color expresado con un nombre. COLOR: red</div>
	</body>
</html>

estilos121D.css

Código: [Seleccionar]

html, 
body { height:100%; margin:0px; }

.primera { border: 1px solid #000; height:16.6%; background-color:rgb(210,200,100); text-align:center;}  
.segunda { border: 1px solid #000; height:16.6%; background-color:rgba(100,255,100,0.5); text-align:center; }
.tercera { border: 1px solid #000; height:16.6%; background-color:#F0FFFF; text-align:center; }
.cuarta { border: 1px solid #000; height: 16.6%; background-color:hsl(50,70%,70%); text-align:center; }
.quinta { border: 1px solid #000; height:16.6%; background-color:hsla(150,35%,30%,0.8); text-align:center; }
.sexta { border: 1px solid #000; height:16.6%; background-color:red; text-align:center; }

Queria hacer una pregunta, he intentado agrupar el align:center; en una linea de CSS,
concretamente

Código: [Seleccionar]

span {text-align:center;} o div span {text-align:center;}

pero no me ha dado resultado, no se aplicaba, podríais decirme porque y como deberia hacerse, para ir aprendiendo jeje gracias.

pedro,, · « **Respuesta #1 en:** 15 de Febrero 2016, 10:34 »

Hola Lorenzo.

Te faltó separarlo con una coma:

Código: [Seleccionar]

div, span{text-align:center;}
Lo que tu escribiste, dice que todas las etiquetas span que estén dentro de etiquetas div, centren el texto.

Aunque con solo referirnos a los div en este caso valdría, además, como la propiedad border también se repite en todos los div, esa linea podría quedar así:

Código: [Seleccionar]

div{text-align:center; border: 1px solid #000; height:16.6%;}
Saludos.

Lorenzo31 · « **Respuesta #2 en:** 15 de Febrero 2016, 13:23 »

Saludos, entendido y gracias, lo que yo hacia era centrar el texto dentro del SPAN, no dentro del DIV.

Ya entiendo, mil gracias.

Tomo nota.

Foros aprenderaprogramar.com
Didáctica y divulgación de la programación

Noticias: