Web Development Lesson 2 - Text

• Open jsfiddle in your browser.
• Paste the following code into the HTML section of jsfiddle.

My Story

My friend Pablo has a pet dog called Sam who likes to have his tummy scratched. When they go to the park, he likes to chase a ball. He rolls in the dirt so Pablo has to wash him when they get home.

On Sundays they drive to the mountains where he runs around smelling the grass and wagging his tail. He gets so tired that he sleeps all the way home.

• Click 'Run' at the top left of the screen. The results will be shown at the bottom right.

• Notice how the text runs continuously rather than dividing into paragraphs. The browser ignores carriage returns, tabs, double spaces and other document formatting information. We need to add these using HTML 'tags'. Write <p> before each paragraph and </p> at the end of each parragraph. Like this:

My Story
<p>My friend Pablo has a pet dog called Sam who likes to have his tummy scratched. When they go to the park, he likes to chase a ball. He rolls in the dirt so Pablo has to wash him when they get home.</p>
<p>On Sundays they drive to the mountains where he runs around smelling the grass and wagging his tail. He gets so tired that he sleeps all the way home.</p>

• Click 'Run' again and observe the results.
• <p> means 'paragraph'.
• Each HTML tag <p> must have a corresponding closing tag </p>. The closing tag always includes the symbol /.
• Everything between the opening and closing tags is considered part of a single paragraph.

Next: Formatting Text