After completing this topic, you will be able to format horizontal line styles in the style sheet.
Steps:
Add a horizontal line style to the style sheet.
Click the Add Style menu.
Step 1Click the Horizontal Line list item.
Step 2Name the style Thin Line.
Enter the desired information into the Style name field. Enter
Press [Enter].
Step 4Remove the default setting for the style.
Click in the Horizontal Line field in the header.
Step 5You want to format the width of the line so that it is always 50% of the screen width.
Click the Width and Height button.
Step 6Change the width to 50%.
Enter the desired information into the Width field. Enter
Change the unit to a percentage.
Click the Unit list.
Step 8Click the Percentage list item.
Step 9Click the OK button.
Step 10The horizontal line spans 50% of the preview pane.
Step 11We have added another Horizontal Line style and named it Thick Line.
Format the line for a thicker, red line.
Step 12Click the Width and Height button.
Step 13Change the Height of the line to 4 pixels.
Double-click in the Height field.
Step 14Enter the desired information into the Height field. Enter
Click the OK button.
Step 16Change the color of the line to red.
Click the Background Color button.
Step 17Click the red color in the Web Colors palette.
Step 18Click the Ok button.
Step 19The line will act as a separator between large sections. Add 18 points of spacing above and below the line.
Click the Spacing button.
Step 20Enter the desired information into the Before field. Enter
Click in the After field.
Step 22Enter the desired information into the After field. Enter
Click the OK button.
Step 24Save the changes to the style sheet.
Click the Save button.
Step 25We have opened the Page Setup web page. Select the horizontal line element.
Click the horizontal line graphic.
Step 26Apply the Thin Line style.
Click the Styles button.
Step 27Click the Thin Line - Horizontal Line list item.
Step 28The line spans 50% of the width of the web page.
Step 29Preview the web page in the browser.
Click the Open in Browser button.
Step 30The line spans 50% of the width of the browser window.
The line will resize to fit the size of the user's browser window.
Step 31Close the browser window.
Click the Close button.
Step 32Apply the Thick Line style.
Click the Styles button.
Step 33Click the Thick Line - Horizontal Line list item.
Step 34The formatting of the horizontal line changes to a thick, red line.
Step 35After completing this topic, you are able to format horizontal line styles in the style sheet.