<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>My Islamic Website</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body style="background-image: url('makkah.jpg');">
<header>
<div class="logo">
<a href="#"><img src="logo.png" alt="My Islamic Website Logo"></a>
</div>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Quran</a></li>
<li><a href="#">Hadith</a></li>
<li><a href="#">Islamic Articles</a></li>
<li><a href="#">Islamic Videos</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
<main>
<section class="hero">
<h1>Welcome to My Islamic Website</h1>
<p>Discover the beauty and wisdom of Islam through the Quran, Hadith, articles, and videos on our website. We strive to provide authentic and reliable information about Islam to Muslims and non-Muslims alike.</p>
<a href="#" class="cta-button">Explore Now</a>
</section>
<section class="featured-articles">
<h2>Featured Articles</h2>
<div class="article-card">
<a href="#">
<img src="article1.jpg" alt="Article 1">
<h3>Article 1</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse mattis turpis ligula, in ultricies nulla pellentesque eget.</p>
</a>
</div>
<div class="article-card">
<a href="#">
<img src="article2.jpg" alt="Article 2">
<h3>Article 2</h3>
<p>Maecenas sodales dolor vel tellus semper, sit amet blandit mauris posuere. Nulla pulvinar turpis ac tincidunt laoreet.</p>
</a>
</div>
<div class="article-card">
<a href="#">
<img src="article3.jpg" alt="Article 3">
<h3>Article 3</h3>
<p>Vestibulum eget ligula sit amet mauris porttitor semper sed vel sapien. Ut commodo, sapien vel consequat commodo.</p>
</a>
</div>
</section>
<section class="videos">
<h2>Latest Videos</h2>
<div class="video-card">
<a href="#">
<img src="video1.jpg" alt="Video 1">
<h3>Video 1</h3>
</a>
</div>
<div class="video-card">
<a href="#">
<img src="video2.jpg" alt="Video 2">
<h3>Video 2</h3>
</a>
</div>
<div class="video-card">
<a href="#">
<img src="video3.jpg" alt="Video 3">
<h3>Video
No comments:
Post a Comment