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 betw
Trang 1Setting 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
Trang 2Modifying 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
Trang 3Selecting 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
5
4
3
2
1
2
5 4
Trang 4◆ 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
Trang 5Paragraph 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
Trang 6One 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