Foros aprenderaprogramar.com
Aprender a programar => C, C++, C#, Java, Visual Basic, HTML, PHP, CSS, Javascript, Ajax, Joomla, MySql y más => Mensaje iniciado por: Pandemia en 02 de Febrero 2016, 22:50
-
Aquí os dejo el código para ver que tal y sobre todo la estructuración puesto que soy principiante y este es mi primer mensaje, agradecería de antemano que me dijerais que tal lo posiciono todo ya que solo he hecho el curso de html desde cero. Repito gracias ante todo por vuestro tiempo.
<!DOCTYPE html>
<html lang="es">
<head>
<title>Color de fondo; propiedad background-color transparent</title>
<meta name="description" content="portal web aprenderaprogramar.com">
<meta name="keywords" content="propiedad background-color css. transparent.">
<meta charset="utf-8">
<link rel="stylesheet"type="text/css"href="estilos6.css">
</head>
<body>
<header>
<h2>background-color tabla de colores transparent</h2>
</header>
<div id="division1" class="divisiones en cajas">
División 1: un color expresado con notación RGB:
rgb(165,66,66)
</div>
<br/>
<div id="division2" class="divisiones en cajas">
División 2: un color expresado con notación RGBA:
rgba(165,39,39,0.5)
</div>
<br/>
<div id="division3" class="divisiones en cajas">
División 3: un color expresado con notación hexadecimal:
#AF3A3A
</div>
<br/>
<div id="division4" class="divisiones en cajas">
División 4: un color expresado con notación HSL:
hsl(116,59%,31%)
</div>
<br/>
<div id="division5" class="divisiones en cajas">
División 5: un color expresado con notación HSLA:
hsla(44,33%,60%,0.6)
</div>
<br/>
<div id="division6" class="divisiones en cajas">
División 6: un color designado con un NOMBRE:
red
</div>
</body>
</html>
Y ahora el CSS
/*color de fondo propiedad background-color css. transparent. CU01021D*/
.divisionesencajas {
text-align: center;
border: 5px solid black;
font-size: 25px;
}
#division1{background-color: rgb(165,66,66);}
#division2{background-color: rgba(165,39,39,0.5);}
#division3{background-color: #AF3A3A;}
#division4{background-color: hsl(116,59%,31%);}
#division5{background-color: hsla(44,33%,60%,0.6);}
#division6{background-color: red;}
-
Buenas Pandemia
Como comentas que son tus primeros mensajes, pedirte que para poner título a los temas sigas las recomendaciones que se dan en https://www.aprenderaprogramar.com/foros/index.php?topic=1460.0 por ejemplo un título adecuado para este hilo sería "CSS Color de fondo. Propiedad background-color CSS. Ejercicio CU01021D"
Sobre el código comentarte que cumples correctamente con lo que pedía el ejercicio aunque tienes cosas a mejorar.
Para los atributos html te recomiendo nunca usar espacios en los nombres de los atributos, por ejemplo en lugar de class="divisiones en cajas" usar class="divisionesEnCajas" ó class="divisiones_en_cajas" ó class="divisionesencajas" o algo similar. Tampoco debes usar tildes ni eñes, esto es una forma de estandarizar y evitar tener problemas a posteriori (no significa que siempre vayan a surgir problemas, pero haciéndolo según el estándar te quedas seguro).
Si te fijas por este problema no te está aplicando los estilos definnidos en .divisionesencajas
En este código he estandarizado la forma de nombrar y ya aplica los estilos que no estaba aplicando
<!DOCTYPE html>
<html lang="es">
<head>
<title>Color de fondo; propiedad background-color transparent</title>
<meta name="description" content="portal web aprenderaprogramar.com">
<meta name="keywords" content="propiedad background-color css. transparent.">
<meta charset="utf-8">
<style type="text/css">
/*color de fondo propiedad background-color css. transparent. CU01021D*/
.divisionesencajas {
text-align: center;
border: 5px solid black;
font-size: 25px;
}
#division1{background-color: rgb(165,66,66);}
#division2{background-color: rgba(165,39,39,0.5);}
#division3{background-color: #AF3A3A;}
#division4{background-color: hsl(116,59%,31%);}
#division5{background-color: hsla(44,33%,60%,0.6);}
#division6{background-color: red;}
</style>
</head>
<body>
<header>
<h2>background-color tabla de colores transparent</h2>
</header>
<div id="division1" class="divisionesencajas">
División 1: un color expresado con notación RGB:
rgb(165,66,66)
</div>
<br/>
<div id="division2" class="divisionesencajas">
División 2: un color expresado con notación RGBA:
rgba(165,39,39,0.5)
</div>
<br/>
<div id="division3" class="divisionesencajas">
División 3: un color expresado con notación hexadecimal:
#AF3A3A
</div>
<br/>
<div id="division4" class="divisionesencajas">
División 4: un color expresado con notación HSL:
hsl(116,59%,31%)
</div>
<br/>
<div id="division5" class="divisionesencajas">
División 5: un color expresado con notación HSLA:
hsla(44,33%,60%,0.6)
</div>
<br/>
<div id="division6" class="divisionesencajas">
División 6: un color designado con un NOMBRE:
red
</div>
</body>
</html>
Salu2
-
Buenas; lo he corregido y tienes razón he quitado lo espacios después de los class y ahora si que sale perfecto. No me había fijado en ese tema. gracias espero que no me pase más.
Gracias por la corrección pero es así como se aprende.
gracias por tu tiempo.
saludos
Hasta pronto