// index.html
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Noticias canal 2</title>
<link rel="stylesheet" href="reset.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<aside class="noticia">
<img src="img/Ultima-Hora-1.png" alt="Esta Pasando" width="100px">
<p class="urgente">Noticias urgente</p>
<a href="https://www.24horas.cl/actualidad/nacional/voraz-incendio-se-registra-en-el-club-de-golf-la-dehesa">Voraz incendio se registra en el Club de Golf La Dehesa</a>
<br>
<a href="https://www.24horas.cl/regiones/zona-sur/araucania/aseguran-que-existiria-video-clave-en-caso-de-joven-extraviada-en-lago">Aseguran que existiría video clave en caso de joven extraviada en lago Villarrica: fue grabado por el francés</a>
</aside>
<main>
<header>
<h1 class="titulo-blog">Terremoto chile 2010</h1>
</header>
<h2 class="titulo-2">Más de 500 muertos.</h2>
<p class="texto-destacado">
El terremoto de Chile de 2010 ocurrió el 27 de febrero a las 03:34 AM, con una magnitud de 8,8 y epicentro frente a Concepción.
<br>Duró 3 minutos y generó un tsunami, causando más de 500 muertos y graves daños en infraestructura. La respuesta inicial fue deficiente,
<br>lo que llevó a mejorar los protocolos de emergencia y alerta temprana.
</p>
<img src="img/Hombre_bandera.jpg" alt="Un hombre sujetando la bandera chilena">
<ol>
<li>Magnitud 8,8</li>
<li>Duro 3 minutos</li>
<li>Dejo graves daños</li>
<li>Su epicentro fue en Concepción</li>
</ol>
<hr>
</main>
<footer class="pie-final">
<strong>©</strong> Recordando noticias, todos los derechos reservados 2025
<br>
<strong>E-mail:</strong> recordandonoticias@gmail.com <strong>Telefono:</strong> +569 - 99995555
<hr>
</footer>
</body>
</html>
//style.css
body {
text-align: center;
display: flex;
flex-direction: column;
justify-content: space-between;
margin: 0;
font-family: Arial, Helvetica, sans-serif;
background-color: #c3dcfe;
}
.noticia {
text-align: center;
text-decoration-line: underline;
width: 100%;
background-color: #c3dcfe;
padding: 10px;
box-shadow: 2px 0 5px rgba(0, 0, 0, 0.1);
order: 1;
}
.urgente{
text-align: center;
padding: 10px;
color: red;
}
.titulo-blog{
font-size: 100px;
text-align: center;
margin: 5px;
padding: 5px;
text-shadow: 0cqmax;
color: #000;
}
.pie-final{
width: none;
display: block;
order: 0;
}
.texto-destacado{
color: #2f4e58;
}
.titulo-2{
color: #000;
font-size: 50px;
text-decoration: underline;
}
//reset.css
* {
margin: 0;
padding: 0;
}
