Discover

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

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

    <title>My First Website</title>

    <style>

        body {

            font-family: Arial, sans-serif;

            background: #f4f4f4;

            margin: 0;

            text-align: center;

        }

        header {

            background: #007bff;

            color: white;

            padding: 25px;

        }

        nav {

            background: #222;

            padding: 15px;

        }

        nav a {

            color: white;

            margin: 10px;

            text-decoration: none;

        }

        section {

            background: white;

            margin: 20px;

            padding: 25px;

            border-radius: 10px;

        }

        button {

            background: #007bff;

            color: white;

            border: none;

            padding: 12px 20px;

            border-radius: 5px;

            cursor: pointer;

        }

        footer {

            background: #222;

            color: white;

            padding: 15px;

        }

    </style>

</head>

<body>

    <header>

        <h1>Welcome to My Website</h1>

        <p>Learning HTML is the beginning of web development.</p>

    </header>

    <nav>

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

        <a href="#about">About</a>

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

        <a href="#contact">Contact</a>

    </nav>

    <section id="home">

        <h2>Home Page</h2>

        <p>This is my first website, built using HTML and CSS.</p>

        <p>Websites help people share information, advertise services,

        communicate with others, and build businesses online.</p>

        <button onclick="alert('Welcome to my website!')">

            Click Me

        </button>

    </section>

    <section id="about">

        <h2>About Us</h2>

        <p>We are passionate about technology, creativity,

        innovation, and helping people learn new skills.</p>

        <p>Our goal is to create useful digital experiences

        that are accessible on computers, tablets, and phones.</p>

    </section>

    <section id="services">

        <h2>Our Services</h2>

        <ul style="display: inline-block; text-align: left;">

            <li>Website Design</li>

            <li>Web Development</li>

            <li>Search Engine Optimization</li>

            <li>Graphic Design</li>

            <li>Digital Marketing</li>

        </ul>

    </section>

    <section id="contact">

        <h2>Contact Us</h2>

        <p>Have a question? Send us a message.</p>

        <form onsubmit="event.preventDefault();

            alert('Thank you for contacting us!');">

            <input type="text" placeholder="Your Name" required>

            <br><br>

            <input type="email" placeholder="Your Email" required>

            <br><br>

            <textarea placeholder="Your Message"

                required></textarea>

            <br><br>

            <button type="submit">Send Message</button>

        </form>

    </section>

    <footer>

        <p>&copy; 2026 My Website. All rights reserved.</p>

    </footer>

</body>

</html>