index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Meow Awesome Portfolio Site 🚀</title>
</head>

<body>

    <!-- Header and Navigation -->
    <header>
        <h1>CodeSpace Cat's Portfolio 🎨</h1>
        <nav>
          <ul>

            <li>
              <a href="#Me" >About Me &#128512</a> 
            </li>
            <li>
                <a href="#Skills" >Skills &#128526</a> 
            </li>
            <li>
                <a href="#P" >Portfolio &#129303</a> 
            </li>
            <li>
                <a href="#C" >Contacts &#129331</a> 
            </li>

          </ul>
            <!-- Navigation Menu -->
        </nav>
    </header>

    <!-- About Me Section -->
    <section id="Me">
        <h2>About Me &#128075</h2>
        <img src="C:\Users\Software.Engineer19\Downloads\cat-codespace.png" alt="codespace cat"/>
        <p>
            Hello! I'm <b>CodeSpace Cat.</b>I'm purr-ssionate about web development and design.<br/>
            I've been pawing at the web industry for just one catnap(that's less than a day in human terms),<br/>
            and I adore crafting pawsitively intuitive,whisker-twitching,and fur-tastic web experiences.Whoa that's a lot of puns.
        </p>
    </section>

    <!-- Skills Section -->
    <section id="Skills">
        <h2>My Skills &#128548</h2>
        <ul>
            <li><b>Web Development &#129504</b></li>
            <li><b>UI/UX Design &#129470</b></li>
            <li><b>Backend Development &#129471</b></li>
            <li><b>Database Management &#128736</b></li>
            <li><b>SEO Optimization &#128736</b></li>
            <li><b>Lying in the sun &#128511</b></li>
        </ul>
    </section>

    <!-- Portfolio Section -->
    <section id="P">
        <h2>Catfolio &#129299</h2>
        <table>
            <thead>
                <tr>
                    <th>Project Name</th>
                    <th>Date</th>
                    <th>Description</th>
                    <th>Thumbnail</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Purrfect Landing Page </td>
                    <td>January 2024 </td>
                    <td> A delightful landing page for luxury cat condo.</td>
                    <td> <img src="1.png" alt="cat1" /></td>
                </tr>
                <tr>
                    <td>Kityy Commerce </td> 
                    <td>February 2024</td> 
                    <td>An online store selling the fanciest catnip toys.</td>
                    <td> <img src="2.png" alt="cat2" /></td>
                    </tr>
                <tr>
                    <td>CatChat Social</td>
                    <td>June 2024</td>
                    <td>Asocial media site for cats to meow and hiss!</td>
                    <td><img src="3.png" alt="cat3" /></td>
            </tbody>
        </table>
    </section>

    <!-- Contact Section -->
    <section id="C">  
        <h2>Contact Me</h2>
        <form>
            <label for="Name">NAME:</label>
            <input type="text" name="Name" />
            <label for="Name2">EMAIL:</label>
            <input type="email" name="Name2" />
            <label for="Name3">MESSAGE:</label>
            <textarea name="message"></textarea>
            <input type="submit"/>
        </form>

    </section>

    <!-- Footer -->
    <footer>
        &copy<b> 2024 CodeSpace Cat.All rights reserved.</b>
    </footer>

</body>
</html>