Giriş Yap

**AvanT2.** · 08-09-2024 Saat: 00:11

Birkaç ay önce uğramıştım, hesap gitti. Neyse, can sıkıntısından böyle bir şey yaptım. Bırakıyorum.

**AvanT2.** · 08-09-2024 Saat: 00:12

İlk paylaşımda resim vs. olmuyormuş, burdan bakabilirsiniz.

https://dassdafaasd.tiiny.site/

screencapture-dassdafaasd-tiiny-site-202...-09-03.png

**mehmetext** · 12-09-2024 Saat: 16:06

Eline sağlık, güzel görünüyor. Kodları biraz inceledim. Sektörde güncel teknolojiler olarak Tailwind CSS ve Next.js kullanılıyor. Eğer frontend alanında kendini geliştirmek istiyorsan bunları öğrenebilirsin, tavsiyemdir.

**kaRanLık-61** · 10-11-2024 Saat: 22:06

eline sağlık

**#Captain** · 11-11-2024 Saat: 02:34

Kod:

<!DOCTYPE html>

<html lang="tr">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Karanlık ve Modern Index</title>

    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">

    <style>

        /* Genel Ayarlar */

        * {

            margin: 0;

            padding: 0;

            box-sizing: border-box;

            font-family: Arial, sans-serif;

        }



        body {

            background: #121212;

            color: #eee;

            overflow-x: hidden;

        }



        a {

            color: #00ccff;

            text-decoration: none;

        }



        /* Navbar */

        nav {

            display: flex;

            justify-content: space-between;

            align-items: center;

            padding: 20px;

            background: rgba(0, 0, 0, 0.8);

            position: fixed;

            width: 100%;

            top: 0;

            z-index: 10;

        }



        nav h1 {

            color: #fff;

            font-size: 1.8em;

        }



        nav ul {

            list-style: none;

            display: flex;

            gap: 20px;

        }



        nav ul li a {

            color: #fff;

            padding: 10px 15px;

            border-radius: 5px;

            transition: background 0.3s;

        }



        nav ul li a:hover {

            background: #00ccff;

        }



        /* Header */

        header {

            display: flex;

            justify-content: center;

            align-items: center;

            height: 100vh;

            background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('https://source.unsplash.com/1600x900/?space,universe');

            background-size: cover;

            background-attachment: fixed;

            text-align: center;

            color: #fff;

            padding: 0 20px;

        }



        header h1 {

            font-size: 3em;

            margin-bottom: 10px;

            animation: fadeIn 2s;

        }



        header p {

            font-size: 1.2em;

            margin-bottom: 20px;

            animation: fadeIn 3s;

        }



        header a.btn {

            padding: 15px 30px;

            background: #00ccff;

            color: #121212;

            font-weight: bold;

            border-radius: 5px;

            transition: background 0.3s;

            animation: fadeIn 4s;

        }



        header a.btn:hover {

            background: #00a3cc;

        }



        /* Bölüm Genel Ayarları */

        section {

            padding: 80px 20px;

            text-align: center;

        }



        .section-title {

            font-size: 2.5em;

            margin-bottom: 20px;

            position: relative;

        }



        .section-title::after {

            content: "";

            display: block;

            width: 100px;

            height: 3px;

            background: #00ccff;

            margin: 10px auto;

        }



        /* Özellikler Bölümü */

        .features {

            display: flex;

            justify-content: center;

            gap: 30px;

            flex-wrap: wrap;

        }



        .feature {

            flex: 1;

            max-width: 250px;

            background: #1a1a1a;

            padding: 30px;

            border-radius: 8px;

            transition: transform 0.3s;

        }



        .feature:hover {

            transform: scale(1.05);

        }



        .feature i {

            font-size: 3em;

            color: #00ccff;

            margin-bottom: 15px;

        }



        /* Footer */

        footer {

            background: #000;

            padding: 40px 20px;

            color: #fff;

        }



        .footer-content {

            display: flex;

            justify-content: space-around;

            text-align: left;

        }



        .footer-section {

            max-width: 200px;

        }



        .footer-section h4 {

            margin-bottom: 15px;

            font-size: 1.2em;

        }



        .footer-section a {

            color: #aaa;

            display: block;

            margin-bottom: 10px;

        }



        .footer-section a:hover {

            color: #00ccff;

        }



        .social-icons a {

            color: #aaa;

            margin-right: 10px;

            font-size: 1.5em;

            transition: color 0.3s;

        }



        .social-icons a:hover {

            color: #00ccff;

        }



        /* Animasyonlar */

        @keyframes fadeIn {

            0% { opacity: 0; }

            100% { opacity: 1; }

        }

    </style>

</head>

<body>



    <!-- Navbar -->

    <nav>

        <h1>eXpertBoss</h1>

        <ul>

            <li><a href="#home">Anasayfa</a></li>

            <li><a href="#features">Özellikler</a></li>

            <li><a href="#about">Hakkımızda</a></li>

            <li><a href="#services">Hizmetler</a></li>

            <li><a href="#contact">İletişim</a></li>

        </ul>

    </nav>



    <!-- Header -->

    <header id="home">

        <div>

            <h1>Hayallerin Ötesine Hoş Geldiniz</h1>

            <p>Bu evren sizin hayal gücünüzle şekilleniyor.</p>

            <a href="#features" class="btn">Keşfet</a>

        </div>

    </header>



    <!-- Özellikler Bölümü -->

    <section id="features">

        <h2 class="section-title">Özellikler</h2>

        <div class="features">

            <div class="feature">

                <i class="fas fa-magic"></i>

                <h3>Yaratıcı Güç</h3>

                <p>Hayallerinizi gerçeğe dönüştürmek için buradayız.</p>

            </div>

            <div class="feature">

                <i class="fas fa-globe"></i>

                <h3>Sonsuz Evren</h3>

                <p>Keşfedilecek sınırsız dünyalar sizi bekliyor.</p>

            </div>

            <div class="feature">

                <i class="fas fa-star"></i>

                <h3>Özgün Tasarım</h3>

                <p>Her detay size özel ve benzersiz.</p>

            </div>

        </div>

    </section>



    <!-- Footer -->

    <footer>

        <div class="footer-content">

            <div class="footer-section">

                <h4>Hakkımızda</h4>

                <p>eXpertBoss, hayal gücünüzü genişletmek ve sizi büyülü bir dünyaya taşımak için burada.</p>

            </div>

            <div class="footer-section">

                <h4>Hızlı Bağlantılar</h4>

                <a href="#home">Anasayfa</a>

                <a href="#about">Hakkımızda</a>

                <a href="#services">Hizmetler</a>

                <a href="#contact">İletişim</a>

            </div>

            <div class="footer-section">

                <h4>Sosyal Medya</h4>

                <div class="social-icons">

                    <a href="#"><i class="fab fa-facebook-f"></i></a>

                    <a href="#"><i class="fab fa-twitter"></i></a>

                    <a href="#"><i class="fab fa-instagram"></i></a>

                    <a href="#"><i class="fab fa-linkedin-in"></i></a>

                </div>

            </div>

        </div>

        <p style="text-align: center; margin-top: 20px;">&copy; 2024 eXpertBos, tüm Hakları Saklıdır.</p>

    </footer>



</body>

</html>

Merhaba, hoşuma gitti ancak şu tarz ve thread navbar'larıyla daha iyi olabilirdi diye düşünüyorum.

Giriş Yap
Kullanıcı Adı:
Şifreniz:	Şifremi Unuttum?
	Beni Hatırla