HTML and CSS Reference
In-Depth Information
Use the
<p>
element only if there is not a more specific element, such as a heading element, available for marking
up the content.
Adding Text to the Home Page
Now it's time to add more content to the home page. You can see the code for this exercise on the topic's companion
website, but I recommend you try practicing your coding skills by working through the following steps before look-
ing at the file.
The code for this exercise can be found in folder 2.
1.
Open the
index.html
in your project folder.
2.
Locate the
<section>
element in your code that has the ID
home-text
.
3.
Delete the dummy text that you added to this element in Chapter 3.
4.
Create a new
<h1>
element within this
<section>
element.
5.
Add the following text to this new
<h1>
element:
Welcome to Joe's Pizza Co
.
6.
Add the following text below the new
<h1>
element. Note the use of
<p>
elements here and the link in the
second paragraph.
<p>
We pride ourselves on serving up the best pizzas in New York City. Come
and visit one of our family-friendly restaurants and take a look at our
wide range of authentic Italian pizzas. We can also deliver direct to your
door with our speedy takeaway service.
</p>
<p>
Please take a look at the <a href="locations.html">Locations</a> page
for more information about where you can find our fantastic restaurants.
</p>
7.
Save the
index.html
file.
Your code for the home text section should now look like the following:
<!-- Home Text -->
<section id="home-text">
<h1>Welcome to Joe's Pizza Co.</h1>
<p>
We pride ourselves on serving up the best pizzas in New York City. Come and
visit one of our family-friendly restaurants and take a look at our wide range
of authentic Italian pizzas. We can also deliver direct to your door with our
speedy takeaway service.
</p>
<p>
