<!DOCTYPE html>
<html lang="ur">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>میری پروفیشنل ویب سائٹ</title>
<style>
/* Basic Styling */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
background-color: #f4f4f4;
}
/* Navigation Bar */
.navbar {
background-color: #007bff;
padding: 15px;
text-align: center;
}
.navbar a {
color: white;
padding: 10px 15px;
text-decoration: none;
font-size: 18px;
}
.navbar a:hover {
background-color: #0056b3;
}
/* Sections */
.section {
padding: 50px;
text-align: center;
}
/* Footer */
.footer {
background-color: #333;
color: white;
text-align: center;
padding: 15px;
position: fixed;
width: 100%;
bottom: 0;
}
/* Buttons */
.btn {
background-color: green;
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
}
</style>
</head>
<body>
<!-- Navigation Menu -->
<div class="navbar">
<a href="#home">ہوم</a>
<a href="#about">ہمارے بارے میں</a>
<a href="#services">سروسز</a>
<a href="#contact">رابطہ کریں</a>
</div>
<!-- Home Section -->
<div id="home" class="section">
<h1>خوش آمدید ہماری ویب سائٹ پر!</h1>
<p>یہ ایک مکمل Blogger ویب سائٹ ہے، جو HTML, CSS اور JavaScript پر بنی ہے۔</p>
<button class="btn" onclick="showMessage()">مزید جانیں</button>
</div>
<!-- About Section -->
<div id="about" class="section" style="background-color: #ddd;">
<h2>ہمارے بارے میں</h2>
<p>ہم ایک ڈیجیٹل سروس پرووائیڈر ہیں جو ویب ڈیزائن، SEO، اور بلاگنگ میں مہارت رکھتے ہیں۔</p>
</div>
<!-- Services Section -->
<div id="services" class="section">
<h2>ہماری سروسز</h2>
<ul>
<li>ویب ڈیزائننگ</li>
<li>SEO آپٹیمائزیشن</li>
<li>بلاگ مینجمنٹ</li>
<li>سوشل میڈیا مارکیٹنگ</li>
</ul>
</div>
<!-- Contact Section -->
<div id="contact" class="section" style="background-color: #ddd;">
<h2>ہم سے رابطہ کریں</h2>
<p>ای میل: example@gmail.com</p>
<p>فون نمبر: +92 300 1234567</p>
</div>
<!-- Footer -->
<div class="footer">
<p>© 2025 میری ویب سائٹ | تمام حقوق محفوظ ہیں</p>
</div>
<!-- JavaScript -->
<script>
function showMessage() {
alert("شکریہ! آپ ہماری ویب سائٹ وزٹ کر رہے ہیں۔");
}
</script>
</body>
</html>
0 comments:
Post a Comment