- Creating a New Page and Adding Text
- Setting Page Properties
- Introducing Cascading Style Sheets
- Changing Text Attributes in the Property Inspector
- Aligning Text
- Creating Lists and Indenting Text
- Adding a Separator to a Page: The Horizontal Rule
- Saving Your Work and Previewing in a Browser
- Summary
- Q&A
- Workshop
- Exercises
Creating Lists and Indenting Text
By using Dreamweaver, you can create bulleted lists, called unordered lists in HTML, and numbered lists, called ordered lists in HTML. The Unordered List and Ordered List buttons appear in the Property inspector when you have text selected.
First, create an unordered list by following these steps:
Type three items for the list, pressing the Enter (or Return) key after each item so that each is on its own line.
Drag the cursor over all three items to select them.
Click the Unordered List button in the Property inspector, as shown in Figure 3.15.
Figure 3.15 The Property inspector has buttons to create ordered and unordered lists. You can select the Indent and Outdent buttons to nest lists or to indent and outdent text.
Now each line is preceded by a bullet. Next, add another list that is nested in the first list:
Place the insertion point after the last item.
Press the Enter key to make a new line. The new line should be preceded by a bullet.
Type three items, as you did in the previous list.
Drag the cursor over these new items and select the Indent button in the Property inspector.
Now the second list is nested within the third item of the first list. You can tell because it is indented and preceded by a different style of bullet. Use the Outdent button to place the nested list back in line with the main list.
To turn the nested unordered list into an ordered list, select the three items in the nested list again and click the Ordered List button in the Property inspector. To bring the nested list back in line with the main list, select the Outdent button.
With regular text, you use the Indent and Outdent buttons to modify the margins of a block of text. In HTML there is no easy way to tab or indent text, so Dreamweaver uses the <blockquote> tag to indent. This tag actually indents both the left and right sides of the text, so it might look strange if you indent multiple times.