Entrar ¿Aún no tienes acceso?
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Haga lo que hicimos en aula

Referente al curso HTML y CSS: Clases, Posicionamiento y Flexbox, en el capítulo Estilo de texto y fuentes y actividad Haga lo que hicimos

por Ivan Garcia Romero
| 26.4k xp | 75 posts
Estudiante

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad 


@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

* {
    padding: 0;
    margin:0;
}

body{
    height: 100vh;
    box-sizing: border-box;
    background-color: #000000;
    color: #F6F6F6;
}


.titulo-destaque {
    color: #22D4FD; ;
}

.presentacion {
    display: flex;
    align-items: center;
    margin: 10%;
    justify-content: space-between;
}

.presentacion_contenido{
    width: 615px;
    height: 482px;
}

.presentacion_contenido_titulo{
    font-size: 36px;
    font-family: "Krona One", sans-serif;
}

.presentacion_contenido_texto{
    font-size: 24px;
    font-family: "Montserrat", sans-serif;
    

}
1 respuesta
por Brenda Souza
| 4985.6k xp | 17961 posts
Instructor Scuba

Hola Ivan, espero que estés bien

Parece que estás trabajando en un diseño que utiliza Flexbox para organizar el contenido. Según la descripción de la actividad, el objetivo es espaciar adecuadamente los elementos y ajustar el tamaño del texto para que coincida con un diseño en Figma.

Aquí tienes algunas sugerencias para asegurarte de que tu código cumpla con los requisitos:

  1. Espaciado y márgenes con Flexbox:

    • Ya estás utilizando justify-content: space-between;, lo cual es correcto para espaciar los elementos. Asegúrate de que los márgenes no sean demasiado grandes, ya que margin: 10%; puede estar separando demasiado los elementos del borde.

  2. Definiendo el tamaño de la sección de texto:

    • La clase .presentacion_contenido tiene un ancho y alto definidos. Si estos valores no coinciden con el diseño de Figma, ajústalos según sea necesario.

  3. Ajustando tamaños de títulos y textos:

    • Verifica que los tamaños de fuente en .presentacion_contenido_titulo y .presentacion_contenido_texto sean los correctos según el diseño de Figma.

  4. Importando y aplicando fuentes de Google Fonts:

    • Ya has importado las fuentes correctamente. Asegúrate de que las clases CSS estén aplicadas a los elementos HTML correctos.

  5. Personalizando fuentes de títulos y textos:

    • Verifica que las propiedades font-family estén aplicadas correctamente a los elementos que deseas estilizar.

Si después de revisar estos puntos sigues teniendo problemas, podrías considerar revisar el HTML para asegurarte de que las clases estén aplicadas correctamente y que no haya errores de sintaxis.

Espero que estas sugerencias te sean útiles. ¡Buena suerte con tu proyecto!

Espero haber ayudado y buenos estudios!