Adding Text

html.jpg image

In a Web page, you can add different types of text elements to the HTML document. HTML documents are divided into paragraphs. You can organize text on your Web page by creating and aligning paragraphs. When you do not want a full paragraph break, you canse use line breaks to keep lines of text adjacent. When you format text with heading tags, you can create large, bold text and specify a range of sizes. Heading 1 is the largest and Heading 6 is the smallest. You can organize text items into ordered and unordered lists. Unordered lists have items that are indented and bulleted. Ordered lists have items that are indented and numbered or lettered.

Key Elements of an HTML Document
HTML Tags for Text Elements
Syntax Description
<P>...</P> Defines a paragraph
<BR> Defines a single line break
&nbsp; Inserts a blank space
<PRE>...</PRE> Defines preformated text
<H1> to <H6>...</H1> to </H6> Defines a heading level
<!-->...<--> Defines a comment
<OL>...</OL> Defines an ordered (number)list
<UL>...</UL> Defines an unordered (bullet)list
<LI>...</LI> Defines a list item

Steps in adding text to your HTML document:

  1. Create a New Paragraph
  2. Add a Line Break
  3. Insert a Blank Space
  4. Insert Preformated Text
  5. Insert Headings
  6. Insert a Comment
  7. Create a Number Lists
  8. Create a Bulleted List

1. Create a New Paragraph

You can use paragraph tags to start new paragraphs in an HTML document. In a word processing program, you press the Enter or Return key to start a new line. Web browsers do not read these line breaks. Instead, you must insert a <P> tag any time you want to start a new paragraph in your Web page. Paragraphs are left aligned by default, but you can use the align attribute to change the horizonal alignment of text.

2. Add a Line Break

You can use the break tag, <BR> to create a line break to start a new line of text. Ordinarily, Web browser wrap text automatically so it continues to the next line when the current line reaches the right side of the browser window. You can insert a line break to instruct the browser to break the text to a new line. Line breaks give you control over where the text breaks

3. Insert a Blank Space

You can insert blank spaces &nbsp; - non breaking space) within a line of text to create indents or add emphasis to the text. You can also use blank spaces to help position elements on a Web page, such as a graphic or photo.

4. Insert a Preformated Text

You can use the preformatted tags, <PRE> and </PRE>, to keep the line breaks and spaced you enter for a paragraph or block of text. Web browsers ignore the hard returns, line breaks , or extra spaces between words unless you insert the preformatted text element tags. If you type a paragraph with spacing just the way you want it, you can assign the preformatted tags <PRE> to keep the spacing in place.

5. Insert a Heading

You can use headings to help clarify information on a page, organize text, and create a visual structure. You can choose from six different heading levels for a document ranging from heading level 1 (<H1>) the largest to heading level 6 (<H6>), the smallest. Headings appear as bold type on a Web page.

6. Insert a Comment

You can use comments tags <!-- text --> to write notes to yourself within an HTML document. Comments do not appear on the actual Web page. For example, you might leave a comment about a future editing task, or leave a note to other Web developers viewing your HTML code.

7. Create a Numbered List

You can use numbered lists tag <OL> in your Web page to display all kinds of ordered lists. For example, you can use numbered lists (ordered list) to show steps or prioritize items. Below the <OL>, you will then need to use the list tag <LI>...</LI> to display your list items

8. Create a Bulleted List

You can add a bulleted list tag <UL> to your document to set apart a list of items from the rest of the page of text. Also called unordered list, you can use a bulleted list when you do not need to show the items in a particular order. By default, bulleted lists appear with solid bullets on your Web page. Below the <UL>, you will then need to use the list tag <LI>...</LI> to display your list items.