adobe dreamweaver cs5 on demand part 17 pps

ptg 102 Chapter 5 Setting Copy/Paste Preferences Set Copy/Paste Preferences Click the Dreamweaver (Mac) or Edit (Win) menu, and then click Preferences. Click the Copy/Paste category. Select from the following check boxes: ◆ Text Only. Pastes unformatted text. ◆ Text With Structure (para- graphs, lists, tables, etc.). Pastes structured text without formatting. ◆ Text With Structure Plus Basic Formatting (bold, italic). Pastes structured text and simple HTML formatting. ◆ Text With Structure Plus Full Formatting (bold, italic, styles). Pastes structured text, HTML formatting, and CSS styles. Select the Retain Line Breaks check box to keep line breaks in pasted text. Select the Clean Up Word Paragraph Spacing check box if you selected the Text with Structure or Text with Structure Plus Basic Formatting option, and want to eliminate extra space between paragraphs when you paste your text. Click OK. 6 5 4 3 2 1 You can use the Copy/Paste section of the Preferences dialog box to customize how the Paste command inserts text into a Web page. You can set special paste preferences as default options to paste text from other programs. You can set options to paste text only, text with struc- ture, such as paragraphs, list and tables, and text with structure and formatting, including HTML and CSS styles. 2 4 5 3 6 From the Library of Wow! eBook ptg Chapter 5 Working with Web Page Text 103 Modifying Font Combinations Modify Font Combinations Click the Format menu, point to Font, and then click Edit Font List. Select the font combination you want to edit. Use any of the following to add, modify, or remove the selected font combination. ◆ New Combination. Click the Add button (Plus), select a font from the Available Fonts list, and then click Left Arrow button to add it to the font list. ◆ Delete Combination. Select the font combination you want to remove, and then click the Subtract button (Minus). ◆ Add Fonts. Select a font from the Available Fonts list, and then click Left Arrow button to add it to the font list. ◆ Remove fonts. Select a font from the Chosen Fonts list, and then click Right Arrow button to remove it from the font list. ◆ Change Combination Order. Select the font combination you want to arrange, and then click the Up or Down arrows. Click OK. 4 3 2 1 When you select one of Dreamweaver's default fonts, you'll notice that they come in groups of three: A primary font, secondary font, and gen- eral font. This is known as a font combination. Font combinations determine how a browser displays text in your Web page. A browser uses the first font in the combination that is installed on the user’s sys- tem. For example, if you choose the Arial and the visitor does not have Arial, the browser attempts to find Helvetica, if it can't find Helvetica, it substitutes a sans-serif font. If none of the fonts in the combination are installed, the browser displays the text as specified by the user’s browser preferences. You can use the Edit Font List command to set the font combinations that appear in the Properties panel and the Font submenu on the Format menu. 4 3 From the Library of Wow! eBook ptg 104 Chapter 5 Selecting text is one thing; knowing what to do with it once it's been selected is another. Dreamweaver has a set of character formatting tags that allows you to change the size, color and style of the text, and then generate the specific HTML tags. Remember, formatting text is not just about changing the text; you also have you ask yourself the ques- tion of why you're changing it. Does that heading text really need to be THAT big… Is it OK to change the color of text to red? Many a good Web site has gone down the tubes because of bad design. Remember, do not change the text just because you can; change it because it reflects the overall design of the site. Formatting Characters Format Text Characters Open the Web page you want to format. Select a word inside the text that you want to modify. TIMESAVER Press Ctrl+A (Win) or A +A (Mac) to select all of the text within the selected body. Click the Window menu, and then click Properties to open the Properties panel. Click HTML to format HTML tags or click CSS to modify CSS. Choose from the following type of formatting options: ◆ Format. Click the button and choose from the predefined styles. Leave this option at its default value. ◆ Class. Displays the class style currently applied to the text. If no styles have been applied the option displays No CSS. Leave this option at its default value. ◆ Bold. Click to bold the selected text. ◆ Italic. Click to italicize the selected text. ◆ Font. Click to change the font type of the selected text. 5 4 3 2 1 2 5 4 From the Library of Wow! eBook ptg Chapter 5 Working with Web Page Text 105 ◆ Size. Click the Size button, and then first choose how you want to measure font sizes (percent, pixels, points, etc), and then change the size in the input field. For example, if you're fonts by percentage (default), and you change the size to 50 percent, the selected text will be half the size of the standard font; 200 percent, twice the size, etc. ◆ Text Color. Click the Text Color button, and then choose a new color for the selected text, or click in the coding box and type in the hexadecimal code value for the desired color. NOTE Hexadecimal codes are preceded by a pound sign (#), and are three sets of double-digit number values representing the percentages of red, green, and blue, respectively. 4 Formatted text characters Did You Know? You can make multiple formatting changes at once. After you select the text you want to change, if you click the Page Properties button on the Properties panel, you can perform all of your formatting changes to the text, and change options to the Page Properties at the same time. From the Library of Wow! eBook ptg 106 Chapter 5 Paragraph text formatting differs from standard text formatting in one way: The changes made impact the entire paragraph, not just the indi- vidual words. For this reason, paragraph formatting does not require you to select the paragraph; you just have to click inside the paragraph you want to change. Once the paragraph is selected you can work with Dreamweaver's paragraph style options. Formatting Paragraph Text Format Paragraph Text Open the Web page you want to format. Select a word inside the text that you want to modify. Click the Window menu, and then click Properties to open the Properties panel. Click HTML to format HTML tags or click CSS to modify CSS. Choose from the following type formatting options: ◆ Format. Click the Format button and select one of the available options. NOTE The paragraph style applies the default style for an <p> HTML tag, as do the H1 thru H6 Heading styles. ◆ Align. Select one of the justification buttons: Align Left, Align Right, Align Center, or Justify to change the justification of the active paragraph. ◆ Indent. Click the Text Indent or Text Outdent button to indent (in or out) the left margin of the text paragraph. ◆ Ordered/Unordered. Click the Ordered List or Unordered List button to convert the select paragraph into a list. The formatting options are applied to the selected text. 5 4 3 2 1 2 5 4 CSS properties From the Library of Wow! eBook ptg Chapter 5 Working with Web Page Text 107 One of the problems with formatting text on a Web page is the problem of controlling line spacing. For example, when you press the Enter key to create a new paragraph, HTML create a <p> or paragraph tag, jumps you down to the next line, and leaves a bit of extra space between the lines; however, what if you don't want the extra space? HTML takes care of this pesky problem by giving us another obscure HTML code called a line break, or the <br> tag. Controlling Line Spacing Control Line Spacing Open the Web page you want to change. Click your mouse inside the document and begin typing. Use either of the following to control line spacing: ◆ Paragraph. Press the Enter key. Dreamweaver inserts the paragraph tag <p> into the text and adds extra line spacing between the two lines. ◆ Line Break. Press the Shift + Enter keys. Dreamweaver inserts the line break tag <br> into the text and does not add any extra space between the lines. 3 2 1 3 2 From the Library of Wow! eBook . primary font, secondary font, and gen- eral font. This is known as a font combination. Font combinations determine how a browser displays text in your Web page. A browser uses the first font in. the selected font combination. ◆ New Combination. Click the Add button (Plus), select a font from the Available Fonts list, and then click Left Arrow button to add it to the font list. ◆ Delete. Combination. Select the font combination you want to remove, and then click the Subtract button (Minus). ◆ Add Fonts. Select a font from the Available Fonts list, and then click Left Arrow button