HTML Element - Footer tryit

Run Enroll

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sample Page with Header and Footer</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 0;
        }

header {
            background-color: #4CAF50;
            color: white;
            padding: 15px 0;
            text-align: center;
        }

footer {
            background-color: #333;
            color: white;
            text-align: center;
            padding: 10px 0;
            position: fixed;
            bottom: 0;
            width: 100%;
        }

main {
            padding: 20px;
            margin-bottom: 60px; /* to prevent content overlap with footer */
        }
    </style>
</head>

<body>

<header>
        <h1>Welcome to My Website</h1>
        <p>Your go-to place for awesome content!</p>
    </header>

<main>
        <h2>About Us</h2>
        <p>This is a sample webpage that showcases how to use a header and footer in HTML.</p>
        <p>The main content of your webpage goes here. You can add text, images, videos, or anything you like in this section.</p>
    </main>

</body>

</html>

Luna Learn 24

HTML Element - Footer tryit

Post a Comment

0 Comments

Amazon

Search This Blog

Popular Post

Reflections - Geometry

Translations - Geometry

Adding and Subtracting Polynomials - Algebra I

🎵 A to Z Phonics Song 🎵

Report Abuse

Subscribe Us

Most Popular

Reflections - Geometry

Translations - Geometry

Adding and Subtracting Polynomials - Algebra I

🎵 A to Z Phonics Song 🎵

Multiplying Polynomials

Distance and Midpoint Formula

Rotations - Geometry Lesson

Alphabet Groove

Complementary and Supplementary Angles - Geometry

Facebook

Tags

Categories

Visit Our Amazon Storefront

Popular Posts

What is Algebra?

Rotations - Geometry Lesson

Angle Relationships in Parallel Lines - Geometry

Get new posts by email:

Cookie Preferences

Total Pageviews

Contact Form

Footer Menu Widget

Contact form

HTML Element - Footer tryit

Post a Comment

0 Comments

Amazon

Search This Blog

Popular Post

Social Plugin

Subscribe Us

Most Popular

Facebook

Tags

Categories

Visit Our Amazon Storefront

Popular Posts

Get new posts by email:

Cookie Preferences

Total Pageviews

Contact Form

Footer Menu Widget

Contact form