HTML and CSS Reference
In-Depth Information
The code for this exercise can be found in folder 7.
1.
Open the
about.html
file in your text editor.
2.
Add a new
<section>
element within the
<div>
that you just created in the content page template. You
should give this new element an ID of
page-text
.
<div id="container">
<!-- Header -->
<header>...</header>
<!-- Main Content -->
<div>
<!-- Page Text -->
<section id="page-text">
The good stuff goes here!
</section>
</div>
</div>
3.
Save the file.
4.
Open the
about.html
file in your web browser.
5.
Inspect the page using your developer tools and make sure that this new
<section>
appears within the
main content
<div>
.
Open the content page template in your web browser. You should see that the page text section is now displayed, as
shown in Figure 2-9.
Figure 2-9
The content page template with the new page text section.
Adding <section> Elements to the Home Page Template
The home page layout is a little more complex because it has three separate content sections: one for a main feature
banner, one for some information about the company, and one for special offers. You will use a
<section>
ele-
ment for each of these.