HTML and CSS Reference
In-Depth Information
Adding the Special Offers
The final section on the home page is the special offers. In this section, you are going to call on what you learned
about HTML lists in Chapter 3 so you can create a list of special offers.
The code for this exercise can be found in folder 3.
Follow these instructions to add this section to the home page.
1. Open the index.html file.
2. Locate the <section> element with the ID offers .
3. Create a new <h1> element with the text: Special Offers .
4. Create a new <ul> element below the heading that will contain the list of offers.
5. Create an <li> element for the first offer and add to it the offer text: 10% Off All Pizzas When
You Eat In!
6. Create a <li> element for the second offer and add to it the offer text: 20% Off Joe's Pepperoni
Special with the promo code NYBESTPIZZA .
7. Save the index.html file.
Your code should look like this:
<!-- Special Offers -->
<section id="offers">
<h1>Special Offers</h1>
<ul>
<li>10% Off All Pizzas When You Eat In!</li>
<li>20% Off Joe's Pepperoni Special with the promo code
NYBESTPIZZA</li>
</ul>
</section>
That concludes the content for the home page. View the page in your browser; you should see something like Figure
4-3. It's starting to look like a real website!
Search WWH ::




Custom Search