Welcome Section

Introducing visitors to your site

Content Section

Add to your index.html, on a new line after your closing </header> tag:

<header class="page-header">
    <h1>My Awesome Website</h1>
</header>

<section class="page-content">

    <h2>Hello there, amazing person!</h2>

    <p>
    This is a site all about my favourite stuff, 
    thanks so much for visiting.
    </p>

</section>

We will use this page-content section on every page,
but we will change the content inside it for each page.

Content Section Design

Add to your style.css:

.page-content {
    background-color: #222222;
    padding: 30px;
    width: 700px;
    margin: 0 auto;
    margin-top: 30px;

    color: #FFFFFF;
    font-size: 14px;
    line-height: 130%;
}

This code will give you a starting point to begin
designing your content section.

Content Section Ideas

Take a few minutes to make your content section

look how you want it.

Thumbs Up!

Welcome Section: Complete!

Great, now let’s add in a photo album…

Take me to the next chapter!

Loading...