Autor Tema: CSS cómo poner color al texto y darle tamaño adecuado fuente ejercicio CU01013D  (Leído 2531 veces)

Alfredo017498

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 3
    • Ver Perfil
Hola, espero estar escribiendo en el foro adecuado.

    El apartado b) del ejercicio CU01013D del curso básico de programación con CSS de aprenderaprogramar dice: "Usando CSS establece como color de texto el rojo (red) y tamaño de fuente el 130% respecto de lo normal para los elementos h1 que se encuentren dentro de un elemento cuyo valor class sea <<principal>>."

    En este caso, el código css sería (si he entendido bien): 

Código: [Seleccionar]
h1.principal {color:red; font-size: 130%;}
pero no se produce ningún cambio. Sin embargo, si pongo sólo:
.principal {color:red; font-size: 130%;}

 esto afecta a todo el <div>, como es de esperar.

Si pongo:

Código: [Seleccionar]
.principal h1{color:red; font-size: 130%;}
el h1 se cambia a rojo pero se reduce bastante su tamaño.

¿Qué estoy haciendo mal? Gracias de antemano.


Código HTML:
Código: [Seleccionar]
<!DOCTYPE html>

<html><head><title>ejercicio 13</title>
<meta name="description" content="Portal web aprenderaprogramar.com">
<meta name="keywords" content="aprender, programar, cursos, libros">
<meta charset="utf-8">
<link rel="stylesheet"type="text/css"href="CSS Externo.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 T-MOTION</h3>
    <p>Hemos lanzado una nueva versión del producto <span>T-MOTION</span></p>
    <p>
    <img src="http://i.imgur.com/SpZyc.png"
    title="Imagen del proudcto tmotion" alt="imagen producto tmotion" />
    </p>
</div>
</body>
</html>

« Última modificación: 18 de Marzo 2022, 19:45 por Alex Rodríguez »

Alfredo017498

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 3
    • Ver Perfil
Re: Duda con el ejercicio del cap.13 del curso de css
« Respuesta #1 en: 10 de Febrero 2021, 22:05 »
Me auto respondo:
Para que  h1.principal {color:red; font-size: 130%;} funcione, la etiqueta h1 tiene que tener dentro el nombre de la clase, en este caso <h1 class="principal">.
 

Pero todavía tengo la duda de por qué el <h1> reduce su tamaño al aplicarle {font-size:130%;}.

Ogramar

  • Moderador Global
  • Experto
  • *******
  • Mensajes: 2660
    • Ver Perfil
Re: Duda con el ejercicio del cap.13 del curso de css
« Respuesta #2 en: 12 de Febrero 2021, 08:39 »
Buenas, para escribir en los foros es conveniente que sigas las indicaciones que se dan en https://aprenderaprogramar.com/foros/index.php?topic=1460.0 sobre cómo poner el título a los temas, cómo pegar código y resto de cuestiones. Es preferible que pongas el código en el propio hilo en lugar de ponerlo como archivo adjunto

En este hilo https://aprenderaprogramar.com/foros/index.php?topic=1478.0 puedes consultar la solución al ejercicio y algunos comentarios interesantes. Si después de verlo tienes dudas, pega el código que estés usando y explica dónde tienes la duda o problema para intentar ayudarte.

Salu2

Alfredo017498

  • Sin experiencia
  • *
  • APR2.COM
  • Mensajes: 3
    • Ver Perfil
Re: Duda con el ejercicio del cap.13 del curso de css
« Respuesta #3 en: 12 de Febrero 2021, 12:27 »
Gracias

 

Sobre la educación, sólo puedo decir que es el tema más importante en el que nosotros, como pueblo, debemos involucrarnos.

Abraham Lincoln (1808-1865) Presidente estadounidense.

aprenderaprogramar.com: Desde 2006 comprometidos con la didáctica y divulgación de la programación

Preguntas y respuestas

¿Cómo establecer o cambiar la imagen asociada (avatar) de usuario?
  1. Inicia sesión con tu nombre de usuario y contraseña.
  2. Pulsa en perfil --> perfil del foro
  3. Elige la imagen personalizada que quieras usar. Puedes escogerla de una galería de imágenes o subirla desde tu ordenador.
  4. En la parte final de la página pulsa el botón "cambiar perfil".