Home > Articles

Working with Paragraph Elements and HTML Styles

  • Print
  • + Share This

Working with Paragraph Elements and HTML Styles

The Properties Inspector in Dreamweaver is used to select the various formatting options for paragraphs. Some tags, such as the Heading tags, automatically create a paragraph when the closing tag is inserted in the HTML source code. For running text, you must specify the line and paragraph breaks by using the <br> or <p> tag. Aside from affecting the way text looks onscreen, you can also affect the paragraph text by specifying formatting for definition lists, bulleted lists and numbered lists, text alignment, and indents. You can use the preformatted text option to utilize the HTML <pre> tag to align text vertically using the browser's default monospace font. The horizontal rule tag, while not a paragraph formatting option, is included in this chapter because it is used widely to create divisions among formatted paragraph text.

Using the HTML Styles palette, you can define customized styles to format text using standard HTML formatting commands. For example, you can create HTML styles named subhead1 and subhead2, each with specific formatting that includes typeface, size, color, and format. This feature is very helpful if you're working on a large Web site where text is consistently formatted a particular way and works in concert with Dreamweaver templates and library items to maintain a uniform look and feel to your Web site (see Chapter 13, "Creating Templates and Organizing Elements with Libraries").

Entering Paragraph Breaks

When typing HTML code, you can put line breaks, tabs, and extra spaces anywhere you want to format the source code. For this reason you must have a method of indicating line breaks, paragraph breaks, extra space, and tabs for your Web page. Two basic HTML tags create line breaks and paragraph breaks: the <br> tag breaks lines without adding extra space, and the <p> tag adds paragraph space with one extra line space. A paragraph break inserts an additional blank line after each paragraph.

  1. Position your cursor in the Document window where you want to insert a paragraph break.

  2. Press the (Return)[Enter] key to insert a paragraph break. In the HTML code, the paragraph is preceded by the <p> tag and ends with the </p> tag [Figure 3.1].


In order to create multiple <p> tags in a row, Dreamweaver inserts the entity reference for a nonbreaking space (&nbsp;) between the <p> and </p> tag. If there is no content between these two tags, they will be ignored by the browser.

  • + Share This
  • 🔖 Save To Your Account

Related Resources

There are currently no related titles. Please check back later.