Dreamweaver MX Advanced Tutorial: Making dashed lines

dreamweaver| Tutorial

Create a dashed image with fireworks

1. Select "File"/"new", in the "New Document" dialog box, set a width of 1 pixels, high 3 pixels.

2. Select the Zoom tool on the tool panel to enlarge the canvas.

3. Select the Rectangle tool on the tool panel and draw a 1x1 pixel rectangle on the canvas.

4. In the Optimize panel, set the image to be in GIF format. Select File/Export to save the dashed image.

If you use a dashed image as a background image for a cell, the dotted line appears wide. This is caused by the space character in the cell, it is not so easy to delete, in the Code view, after the deletion, Dreamweaver will still be generated. When you insert a 1x1 pixel transparent image, you will naturally delete it.

Generating 1x1 pixel transparent images

Select Edit/Parameter selection. In the Layout view category, click the Create button to create a transparent image.

Make a dashed line

1. Insert a table with two columns in one row. The insertion point is placed in the cell where you want to make a dashed line.

2. In the Sites panel, select the 1x1 pixel transparent image spacer.gif and drag the image to the cell where you want to make a dashed line. At this point, the character disappears automatically.

3. Place the insertion point in the cell where you want to make a dash, and then select the TD label in the label selector in the lower-left corner of the document.

4. In the Properties panel, set the width to 1.

5. Now you need to set the dotted image as a cell background. In the Sites panel, select the dashed image.

6. Drag the dotted image to the background of the cell on the property panel.

7. Make a good dotted line.

8. Press F12 to test the effect in the browser.

If you need to make horizontal dashes, use a similar method.