index.html

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css"> 
  <meta charset="utf-8">
  <title>Home Page</title>
</head>
<body>  
    <header class="grid-container">
        <h1>Home Page</h1>
        <nav>
            <a href="#intro">Introduction</a>
            <a href="#hobbies">Hobbies</a>
            <a href="#interests">Interests</a>
            <a href="#personal">Personal Summary</a>
            <a href="#professional">Professional Summary</a>
        </nav>
    </header>
  
    <section id="intro" class="odd" class="grid-container">
        <h3>Introduction</h3>
        <img src="https://media.istockphoto.com/photos/panoramic-beautiful-view-of-mount-ama-dablam-picture-id513247652?k=6&m=513247652&s=612x612&w=0&h=EKfJRg7_DM2mw4qhaxiCG-uWYOu7QbMC0NSJEyPqws4=" alt="Himalayas" width="500px" height="400px"><br>
        <p>Hello, my name is <b>Jaisingh Bhandari</b>.<br>I am currently a <em>Computer Engineering</em> student studying in the third year of the course.<br>I am very excited to learn new things!</p>
    </section>
    <section id="hobbies" class="even" class="grid-container">
        <h3>Hobbies</h3>
        My hobbies include:
        <ul>
            <li>Trekking</li>
            <li>Playing Video Games</li>
            <li>Exercising, Jogging</li>
        </ul>
    </section>
    <section id="interests"class="odd" class="grid-container">
        <h3>Interests</h3>
        Some of the things that I have an interest in are:
        <ol>
            <li>Becoming a Full-Stack Web Developer</li>
            <li>Photography, Editing</li>
            <li>Travelling</li>
            <li>Mixed Martial Arts</li>
        </ol>
    </section>
    <section id="personal" class="even" class="grid-container">
        <h3>Personal Summary:</h3>
        <p class="content">Third Year Computer Engineering student with a passion to learn and deliver. Have various interests in different fields and participate in a lot of activities, in and outside of college. I consider myself an all-round student.I have great observational and problem solving skills.</p>
    </section>
    <section id="professional" class="odd">
        <h3>Professional Summary:</h3>
        <p class="content">Can code in C, C++, Python, Javascript. Also comfortable in the use of HTML and CSS in web development projects. Proficient in speaking in English and Hindi. Also have experience in troubleshooting PC Systems. Always willing to learn and upgrade my knowledge to stay ahead of the curve.</p>
    </section>
    <footer class="grid-container">
        Connect with me:
        <nav>
            <a href="https://www.linkedin.com/in/jaisingh-bhandari/">LinkedIn</a>
            <a href="https://github.com/jnbhandari27">GitHub</a>
        </nav>
    </footer>
</body>
</html>