• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

The Rules for Lines

Lines (called horizontal rules in HTML) can be used to divide the Web page into visual and logical sections. They give text and graphics elements a little breathing room. Like most page elements, lines work best when you use a layout grid to position them. However, you can place lines without a grid as well.

You can vary the appearance of lines by thickness and, in Internet Explorer browsers (3.0 or later), by color. Netscape does not support the color attribute for the horizontal rule.

To add a horizontal line:

1.
Double-click or drag the Line icon (Figure 4.23) from the Basic tab of the Objects palette to the Document window. The Line Inspector appears (Figure 4.24).

Figure 4.23. Select the Line icon from the Basic tab of the Objects palette.


Figure 4.24. By default, the line displayed will be hollow and 100 pixels wide.


2.
Change the settings in the Line Inspector. You can change the style to a solid rule or change the width and/or height of the line in pixels. You can also drag the line's handles onscreen to change its length (width).

3.
Click one of the alignment buttons to change the line's relationship to the page or to the grid.

Tip

When using layout grids, you can fit a line within a grid or text frame by dragging the Line icon into the desired grid or frame. The line will snap to the width of the grid or frame.


Tip

Lines dropped outside a layout grid can be sized in the Inspector's Width box in pixels, as a percentage of the browser window, or to the full width of the browser window (Figure 4.25).

Figure 4.25. Lines existing outside of a layout grid can be assigned a width of full (the entire width of the page), as a percentage of the width of the page, or as a fixed width in pixels.



Tip

The Align tools on the toolbar and on the Align palette work when the line appears on a layout grid.


Tip

Even if you're not using grids, you can create lines that drop easily into place. To create a line next to an image, for example, place the image first and drag the Line icon into place next to the image. The line is drawn to fill the available space.


  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint