<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Artificial Intelligence</title>
<style>
body{margin:0;font-family:Poppins,Arial,sans-serif;background:linear-gradient(135deg,#e3f2fd,#bbdefb);color:#0d47a1;}
header{background:#1565c0;color:white;text-align:center;padding:60px 20px;}
header h1{font-size:3rem;}
nav{text-align:center;background:#0d47a1;padding:15px;}
nav a{color:#bbdefb;margin:0 20px;text-decoration:none;font-weight:600;}
nav a:hover{color:white;}
section{padding:50px 20px;text-align:center;}
h2{color:#1565c0;font-size:2rem;margin-bottom:20px;}
.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:25px;}
.card{background:white;padding:25px;width:260px;border-radius:12px;box-shadow:0 5px 20px rgba(0,0,0,.15);}
.card h3{color:#1565c0;}
footer{background:#0d47a1;color:white;text-align:center;padding:25px;font-size:22px;}
footer a{color:#90caf9;text-decoration:none;font-weight:bold;}
</style>
</head>
<body>
<header>
<h1>🤖 Artificial Intelligence</h1>
<p>🌍 Revolutionizing the way we live and think</p>
</header>
<nav>
<a href="#what">💡 What is AI?</a>
<a href="#uses">⚙️ Applications</a>
<a href="#future">🚀 Future</a>
</nav>
<section id="what">
<h2>💡 What is AI?</h2>
<p>Artificial Intelligence (AI) is the simulation of human intelligence by machines. It enables systems to learn, reason, and make decisions without human intervention.</p>
</section>
<section id="uses">
<h2>⚙️ Applications of AI</h2>
<div class="cards">
<div class="card"><h3>🏥 Healthcare</h3><p>AI assists in diagnosis, robotic surgeries, and personalized treatments.</p></div>
<div class="card"><h3>🚗 Autonomous Cars</h3><p>Self-driving cars use AI to navigate safely and efficiently.</p></div>
<div class="card"><h3>💬 Virtual Assistants</h3><p>AI powers assistants like Siri and Alexa to make daily life easier.</p></div>
</div>
</section>
<section id="future">
<h2>🚀 Future of AI</h2>
<p>The future of AI holds promises in robotics, education, and climate solutions — but also requires ethical development and careful governance.</p>
</section>
<footer>
© 2025 <a href="https://freecodesforwebsites.blogspot.com/" target="_blank">Free Codes for Websites</a> | All rights reserved.
</footer>
</body>
</html>
Comments
Post a Comment