Haga lo que hicimos en aula | Alura Latam - Cursos online de tecnologia

Haga lo que hicimos en aula

@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 { background-color: #000000; color: #F6F6F6; height: 100vh; box-sizing: border-box; }

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

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

.presentacion__contenido { width: 615px; display: flex; flex-direction: column; gap: 40px; }

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

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

.presentacion__enlaces { display: flex; justify-content: space-between; flex-direction: column; align-items: center; gap: 32px; }

.presentacion__enlaces__subtitulo { font-family: "Krona One", sans-serif; font-size: 24px; font-weight: 400; }

.presentacion__enlaces__link { width: 378px; text-align: center; padding: 21.5px 0; border-radius: 8px; font-family: "Montserrat", sans-serif; font-size: 24px; font-weight: 600; text-decoration: none; color: #F6F6F6; border: 2px solid #22d4fd; }

Hola Carlos, espero que estés bien

Gracias por compartir tu código. Parece que estás trabajando en un diseño usando CSS y has importado algunas fuentes de Google Fonts. Veo que has aplicado estilos a varios elementos de tu página, como body, .titulo-destaque, .presentacion, y otros.

Si estás intentando replicar lo que hicimos en clase, asegúrate de que tu estructura HTML esté correctamente configurada para que estos estilos se apliquen correctamente. Por ejemplo, asegúrate de tener elementos HTML con las clases correspondientes como .presentacion, .presentacion__contenido, etc.

Aquí tienes un ejemplo básico de cómo podría verse tu HTML para que estos estilos funcionen:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>Mi Página</title>
</head>
<body>
    <div class="presentacion">
        <div class="presentacion__contenido">
            <h1 class="presentacion__contenido__titulo">Título de Presentación</h1>
            <p class="presentacion__contenido__texto">Este es un texto de ejemplo para la presentación.</p>
        </div>
        <div class="presentacion__enlaces">
            <h2 class="presentacion__enlaces__subtitulo">Enlaces</h2>
            <a href="#" class="presentacion__enlaces__link">Enlace 1</a>
            <a href="#" class="presentacion__enlaces__link">Enlace 2</a>
        </div>
    </div>
</body>
</html>

Asegúrate de que el archivo CSS esté correctamente vinculado a tu HTML y que las clases coincidan. Esto debería ayudarte a ver los estilos aplicados tal como lo hicimos en clase.

Espero haber ayudado y buenos estudios!