Foros aprenderaprogramar.com
Aprender a programar => Aprender a programar desde cero => Mensaje iniciado por: joseantonio60 en 17 de Abril 2017, 13:55
-
Ante todo saludos ya que soy nuevo en el foro.
Mi pregunta es como debo hacer para añadir una nueva regla para que, por ejemplo, los párrafos me salgan en oblicuo.
Intento hacer de la siguiente manera:
Codigo html
<!DOCTYPE html>
<html>
<head><title>Portal web - aprenderaprogramar.com</title>
<meta charset="utf-8">
<meta name="description" content="Portal web aprenderaprogramar.com">
<meta name="keywords" content="aprender, programar, cursos, libros">
<link rel="stylesheet" type="text/css" href="estilos4.css">
</head>
<body>
<div class="principal"><h1>Novedades</h1><p>Aquí presentamos las novedades del sitio.</p></div>
<div class="secundario">
<h3>Lanzamos el producto <span>X-FASHION</span></h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un bebé.</p>
<p><img src="http://i.imgur.com/tq5Bs.png" title="Imagen del producto" alt="imagen producto x-fashion" /></p>
</div>
<div class="secundario">
<h3>Mejoramos el producto <span>T-MOTION</span></h3>
<p>Hemos lanzado una nueva versión del producto T-MOTION</p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del proudcto tmotion" alt="imagen producto tmotion" /></p>
</div>
</body>
</html>
Codigo CSS
.principal h1{
color:red;
font-size:150%;
}
.secundario h3 {
color:green;
font-size:110%;
}
.secundario h3 span {
background-color:red;
font-size:200%;
}
.secudario p {
font-style:oblique;
}
Entiendo que, con el último elemento, estoy diciendo que todos los parrafos que se encuentren en class secundario tendrian que ser del tipo de letra oblicuo, pero algo estoy haciendo mal, ya que, no sale.
En lecciones anteriores explica como darle formato a los parrafos que no se encuentran entre divisores, pero en este caso si lo están.
Gracias de antemano.
-
Hola joseantonio60,
está bien resuelto, intenta borrar el código y volverlo a escribir. A veces cuando copias-pegas el editor copia cosas que no queremos y no funciona como queremos. Borré esa característica CSS y la volví a escribir y me funcionó.
Saludos
-
Gracias por la respuesta. he reescrito el código de nuevo pero sigue sin salir como debiera.
Lo importante es que me dices que esta bien, ya que tenia la impresión de que no me estaba enterado de nada.
Gracias de nuevo
-
Prueba si te funciona este.
<!DOCTYPE html>
<html>
<head><title>Portal web - aprenderaprogramar.com</title>
<meta charset="utf-8">
<meta name="description" content="Portal web aprenderaprogramar.com">
<meta name="keywords" content="aprender, programar, cursos, libros">
<style>
.principal h1{
color:red;
font-size:150%;
}
.secundario h3 {
color:green;
font-size:110%;
}
.secundario h3 span {
background-color:red;
font-size:200%;
}
.secundario p{
font-style:oblique;
}
</style>
</head>
<body>
<div class="principal"><h1>Novedades</h1><p>Aquí presentamos las novedades del sitio.</p></div>
<div class="secundario">
<h3>Lanzamos el producto <span>X-FASHION</span></h3>
<p>Este producto permite estirar la piel hasta dejarla como la de un bebé.</p>
<p><img src="http://i.imgur.com/tq5Bs.png" title="Imagen del producto" alt="imagen producto x-fashion" /></p>
</div>
<div class="secundario">
<h3>Mejoramos el producto <span>T-MOTION</span></h3>
<p>Hemos lanzado una nueva versión del producto T-MOTION</p>
<p><img src="http://i.imgur.com/SpZyc.png" title="Imagen del proudcto tmotion" alt="imagen producto tmotion" /></p>
</div>
</body>
</html>
Saludos ;)
-
Efectivamente, colocando el codigo css directamente en el documento html funciona correctamente.
También he probado con el css externo y ahora tambien aparecen los resultados buscados.
¿Por que ayer no y hoy sí? Supongo que son misterios de la programación. :o
Gracias ;)