Unless a site is heavy on videos or photo galleries, most content on Web pages is text. This chapter explains which HTML semantics are appropriate for different types of text, especially (but not solely) for text within a sentence or phrase.

Unless a site is heavy on videos or photo galleries, most content on Web pages is text. This chapter explains which HTML semantics are appropriate for different types of text, especially (but not solely) for text within a sentence or phrase.

For example, the em element is specifically designed for indicating emphasized text, and the cite element’s purpose is to cite works of art, movies, books, and more.

Browsers typically style many text elements differently than normal text. For instance, both the em and cite elements are italicized. Another element, code, which is specifically designed for formatting lines of code from a script or program, displays in a monospace font by default.

How content will look is irrelevant when deciding how to mark it up. So, you shouldn’t use em or cite just because you want to italicize text. That’s the job of CSS.

Instead, focus on choosing HTML elements that describe the content. If by default a browser styles it as you would yourself with CSS, that’s just a bonus. If not, just override the default formatting with your own CSS.

Starting a New Paragraph

HTML does not recognize the returns or other extra white space that you enter in your text editor. To start a new paragraph in your Web page, you use the p element ( and ).

Not surprisingly, p is one of the most frequently used HTML elements.

...
<body>
<article>
<h1>Antoni Gaudí</h1>
<p>Many tourists are drawn to Barcelona to see Antoni Gaudí's incredible architecture.</p><p>Barcelona celebrated the 150th anniversary of Gaudí's birth in 2002.</p>
<h2>La Casa Milà</h2>
<p>Gaudí's work was essentially useful. <span lang="es">La
Casa Milà</span> is an apartment building and real people live there.</p>
<h2>La Sagrada Família</h2>
<p>The complicatedly named and curiously unfinished Expiatory
Temple of the Sacred Family is the most visited building in Barcelona.</p>
</article>
</body>
</html>

Here you see the typical default rendering of paragraphs. As with all content elements, you have full control over the formatting with CSS.

To begin a new paragraph

Type <p>.

Type the contents of the new paragraph.

Type </p> to end the paragraph.

TIP

You can use styles to format paragraphs with a particular font, size, or color (and more). For details, consult Chapter 10.

TIP

To control the amount of space between lines, consult “Setting the Line Height” in Chapter 10. To control the amount of space after a paragraph, consult “Setting the Margins around an Element” or “Adding Padding around an Element,” both of which are in Chapter 11.

TIP

You can justify paragraph text or align it to the left, right, or center with CSS (see “Aligning Text” in Chapter 10).