Create two HTML pages (page1.html and page2.html)

Create two HTML pages (page1.html and page2.html).

(a) On page1.html, create a link that points to a specific section of page2.html (e.g., linking to a section with the id="contact").

(b) On page2.html, create a section with the corresponding id="contact".

(c) Ensure that when the link is clicked, the page scrolls directly to the section.

Solution

<!DOCTYPE html>
<html>
<head>
    <title>Page 1</title>
</head>
<body>

    <h2>Welcome to Page 1</h2>
    <p>Click the link below to go to the Contact section on Page 2.</p>

    <a href="page2.html#contact">Go to Contact Section</a>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
    <title>Page 2</title>
</head>
<body>

    <h2>About Page 2</h2>
    <p>This is some content on page 2.</p>

    <p style="margin-top: 800px;">Scroll down for more content...</p>

    <h2 id="contact">Contact Section</h2>
    <p>
        You can contact us at:
        <br>Email: example@email.com
        <br>Phone: 123-456-7890
    </p>

</body>
</html>

Output

Programming Examples

Create two HTML pages (page1.html and page2.html)