index.html
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>TechBlog</title>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<header>
<img src="./Copilot_20251016_155405.png" alt="mascote" class="logo">
</header>
<h1 class="titulo-blog">TechBlog</h1>
<h2>
<strong>Últimas Notícias sobre a Tecnologia</strong>
</h2>
<p class="texto-destaque">A nova geração de chips promete revolucionar o desempenho dos smartphones em 2026.</p>
<p class="urgente">Falha de segurança crítica afeta milhões de dispositivos android.</p>
<footer>
<p>© 2025 TechBlog. Todos os direitos reservados.</p>
</footer>
</body>
</html>
style.css
* {
margin: 0;
padding: 0;
}
body {
background-color: #000000;
color: #CCCCCC;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
padding: 20px;
}
header {
font-size: 2rem;
color: black;
margin-bottom: 20px;
text-align: center;
}
.titulo-blog {
font-size: 2.5rem;
color:#0066FF;
margin-bottom: 10px;
text-align: center;
}
h2 {
font-size: 1.5rem;
color: #CCCCCC;
margin-bottom: 20px;
text-align: center
}
.texto-destaque {
background-color: #1A1A1A;
font-size: 1.2rem;
color: #FF6600;
margin-bottom: 15px;
padding: 15px;
border-radius: 8px;
}
.urgente {
background-color: #330000;
font-size: 1.2rem;
color: #FF0000;
margin-bottom: 15px;
padding: 15px;
border-radius: 8px;
}
footer {
text-align: center;
margin-top: 40px;
font-size: 0.9rem;
color: #666666;
}
.logo {
width: 120px;
height: auto;
display: block;
margin: 0 auto 10px auto;
filter: drop-shadow(0 0 10px #00FFFF);
transition: transform 0.3s ease;
}
.logo:hover {
transform: scale(1.05);
}
