"एन्स डेवलपमेंट" के लिए एक स्वागत संदेश और नेविगेशन के साथ एक वेब पेज

2044 Anes_unk

अनुशंसित

19 May 2025

बहुत बढ़िया पोर्टफोलियो वेबसाइट

8 July 2025

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Anes Development</title>
    <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;600&family=Poppins:wght@400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="styles.css">
</head>
<body>
    <header>
        <nav class="navbar">
            <ul class="nav-links">
                <li><a href="">Home</a></li>
                <li><a href="">Services</a></li>
                <li><a href="">About Us</a></li>
                <li><a href="" target="_blank">Contact</a></li>
            </ul>
            <div class="auth-buttons">
                <a href="Login.html">
                    <button class="btn login">Login</button>
                </a>
            </div>
        </nav>
    </header>

<main>
        <section class="hero">
            <div class="hero-content">
                <div class="hero-text">
                    <div class="welcome-message">Welcome To Anes Development</div>
                    <p class="sub-message">Welcome dear customer, to continue searching and purchasing, please choose the item you wish to buy. If you encounter any issues, feel free to contact us via our Discord.</p>
                </div>
            </div>
        </section>
    </main>

<footer class="custom-footer">
        <div class="footer-section">
            <div class="footer-column">
                <h3>Contact Us</h3>
                <p>Email: <a href="mailto:aneschemma51@gmail.com">aneschemma51@gmail.com</a></p>
                <p>Website: <a href="https://www.web-leb.com/" target="_blank">Webleb</a></p>
            </div>
            <div class="footer-column">
                <h3>Payment Methods</h3>
                <div class="payment-methods">
                    <img src="https://cdn.discordapp.com/attachments/1276543088457683015/1281700630716616838/visa.png.png?ex=66dcac3b&is=66db5abb&hm=989383a99a2e62d6293980b1fb98d67a9c5d80f6863bfbedf48a1d4739a5863a&" alt="Visa">
                    <img src="https://cdn.discordapp.com/attachments/1276543088457683015/1281700631223992361/mastercard.png.png?ex=66dcac3b&is=66db5abb&hm=3dac6cd16463dad6ec1094adf933dab5ca3f20c3ea8791c34a3ba7dda8119d1b&" alt="MasterCard">
                    <img src="https://media.discordapp.net/attachments/1276543088457683015/1281700631853142131/paypal.png.png?ex=66dd54fb&is=66dc037b&hm=d5cb74dbf617c6c59259d97a662784fe297d5a447e5ba4959274c4ecbeb20f52&=&format=webp&quality=lossless" alt="PayPal">
                </div>
            </div>
            <div class="footer-column">
                <h3>Follow Us</h3>
                <ul>
                    <li><a href="#">Facebook</a></li>
                    <li><a href="#">Twitter</a></li>
                    <li><a href="#">Instagram</a></li>
                </ul>
            </div>
        </div>
        <div class="footer-bottom">
            <p>© 2024 Anes Development. All rights reserved.</p>
        </div>
    </footer>
</body>
</html>

CSS

body {
    background-color: #000000;
    background-size: cover;
    background-repeat: no-repeat;
    font-family: 'Poppins', sans-serif;
    margin: 0;
}
header {
    background-color: rgba(0, 0, 0, 0.8);
}
.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 30px;
    background: linear-gradient(90deg, #000000, #6d30084f);
    position: relative;
    z-index: 100;
}
.nav-links {
    display: flex;
    gap: 30px;
}
.nav-links a {
    text-decoration: none;
    color: #ffffff;
    padding: 10px 20px;
    border: 2px solid transparent;
    border-radius: 8px;
    transition: all 0.3s ease;
    position: relative;
}
.nav-links a::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #2c2a29c9;
    z-index: -1;
    transition: opacity 0.3s;
    opacity: 0;
    border-radius: 8px;
}
.nav-links a:hover {
    color: #ffffff;
    border-color: #ff6700;
}
.nav-links a:hover::before {
    opacity: 0.2;
}
.auth-buttons {
    display: flex;
    gap: 10px;
}
.btn {
    padding: 10px 15px;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s;
    border-radius: 5px;
}
.btn.login {
    background-color: #2a2a2a;
    color: #ffffff;
}
.btn.start {
    background-color: #ff6700;
    color: #ffffff;
}
.btn:hover {
    background-color: #3d3d3d;
}
.hero {
    display: flex;
    align-items: center;
    height: 100vh;
    padding: 0 80px;
    background: none;
}
.hero-content {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 1120%;
    max-width: 1400px;
    padding: 40px;
    border-radius: 40px;
    position: relative;
    z-index: 1;
    direction: ltr;
}
.hero-text {
    flex: 2;
    padding-left: 10px;
    color: #ffffff;
    text-align: right;
}
.hero-logo {
    flex: 1;
    display: flex;
    justify-content: center;
    position: relative;
}
.hero-logo img {
    max-width: 120%;
}
.welcome-message {
    font-family: 'Cairo', sans-serif;
    font-size: 70px;
    color: #ff6700;
    animation: fadeIn 2s ease-out;
    white-space: nowrap;
    margin-bottom: 20px;
}
.sub-message {
    font-size: 30px;
    color: #f7f7f7;
    line-height: 1.6;
    margin-top: 40px;
    animation: fadeIn 2s ease-out;
    font-family: 'Cairo', sans-serif;
}
@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.custom-footer {
    color: #e0e0e0;
    padding: 40px;
    border-top: 2px solid rgba(255, 255, 255, 0.3);
}
.footer-section {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}
.footer-column {
    flex: 1;
}
.footer-column h3 {
    margin-top: 0;
    color: #ffffff;
    font-size: 20px;
}
.footer-column p,
.footer-column ul {
    margin: 0;
    color: #cccccc;
}
.footer-column ul {
    list-style-type: none;
    padding: 0;
}
.footer-column ul li {
    margin-bottom: 10px;
}
.footer-column ul li a {
    color: #e0e0e0;
    text-decoration: none;
}
.footer-column ul li a:hover {
    text-decoration: underline;
}
.payment-methods img {
    width: 40px;
    margin-right: 10px;
    vertical-align: middle;
}
.footer-bottom {
    text-align: center;
}

"एन्स डेवलपमेंट" के लिए एक स्वागत संदेश और नेविगेशन के साथ एक वेब पेज

अनुशंसित

पैक मैन गेम

बहुत बढ़िया पोर्टफोलियो वेबसाइट

फर्नीचर शॉप लैंडिंग पेज

HTML

CSS

JS

अनुशंसित

पैक मैन गेम

बहुत बढ़िया पोर्टफोलियो वेबसाइट

फर्नीचर शॉप लैंडिंग पेज

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS