Table Of ContentDreamweaver CS3
THE MISSING MANUAL
The book that
shouldhavebeen
in the box®
Dreamweaver CS3
THE
MISSING
MANUAL
®
David Sawyer McFarland
Beijing • Cambridge • Farnham • Köln • Paris • Sebastopol • Taipei • Tokyo
Dreamweaver CS3: The Missing Manual
by David Sawyer McFarland
Copyright © 2007 O’Reilly Media, Inc. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are
alsoavailableformosttitles(safari.oreilly.com).Formoreinformation,contactourcorporate/institutional
sales department: (800) 998-9938 [email protected].
Printing History:
June 2007: First Edition.
NutshellHandbook,theNutshellHandbooklogo,theO’Reillylogo,and“Thebookthatshouldhavebeen
inthebox”areregisteredtrademarksofO’ReillyMedia,Inc.DreamweaverCS3:TheMissingManual,The
Missing Manual logo, Pogue Press, and the Pogue Press logo are trademarks of O’Reilly Media, Inc.
Many of the designations used by manufacturers and sellers to distinguish their products are claimed as
trademarks. Where those designations appear in this book, and O’Reilly Media, Inc. was aware of a
trademark claim, the designations have been printed in caps or initial caps.
Whileeveryprecautionhasbeentakeninthepreparationofthisbook,thepublisherandauthorassumeno
responsibility for errors or omissions, or for damages resulting from the use of the information contained
herein.
ISBN-10: 0-596-51043-8
ISBN-13: 978-0-596-51043-5
[M]
Table of Contents
The Missing Credits.................................................................................xix
Introduction.................................................................................................1
Part One: Building a Web Page
Chapter 1:Dreamweaver CS3 Guided Tour...........................................19
The Dreamweaver CS3 Interface ...........................................................................................................19
The Document Window....................................................................................................................20
The Insert Bar.....................................................................................................................................23
The Property Inspector .....................................................................................................................25
Panel Groups......................................................................................................................................26
Workspace Layouts ...........................................................................................................................27
Setting Up a Site .......................................................................................................................................28
The Site Definition Wizard................................................................................................................29
Defining a Site the Fast Way ............................................................................................................34
Creating a Web Page ...............................................................................................................................35
The Dreamweaver Test Drive.................................................................................................................38
Phase 1: Getting Dreamweaver in Shape.......................................................................................39
Phase 2: Creating a Web Site...........................................................................................................42
Phase 3: Creating and Saving a Web Page ....................................................................................44
Phase 4: Adding Images and Text ...................................................................................................49
Phase 5: Preview Your Work............................................................................................................55
Phase 6: Finishing the Page..............................................................................................................58
v
Chapter 2: Adding Text to Your Web Pages...........................................65
Adding Text in Dreamweaver .................................................................................................................65
Adding Special Characters................................................................................................................66
Line Breaks .........................................................................................................................................67
Nonbreaking Spaces..........................................................................................................................68
Multiple Spaces ..................................................................................................................................69
Adding a Date to Your Page .............................................................................................................70
Copying and Pasting Text........................................................................................................................71
Simple Copy and Paste .....................................................................................................................71
Paste Special.......................................................................................................................................72
Pasting Text from Word: The Basic Method...................................................................................73
Pasting Text with Word Formatting.................................................................................................75
Pasting Excel Spreadsheet Information ..........................................................................................75
Importing Word and Excel Documents (Windows) ......................................................................76
Selecting Text ............................................................................................................................................76
Spell Checking ..........................................................................................................................................79
About Dictionaries .............................................................................................................................79
Performing the Check........................................................................................................................80
Undo, Redo, and the History Panel .......................................................................................................81
Undo ....................................................................................................................................................81
History Panel ......................................................................................................................................82
Chapter 3: Text Formatting......................................................................85
Paragraph Formatting..............................................................................................................................85
Paragraphs..........................................................................................................................................87
Headlines ............................................................................................................................................88
Preformatted Text ..............................................................................................................................89
Paragraph Alignment ........................................................................................................................90
Indented Paragraphs .........................................................................................................................91
Creating and Formatting Lists ................................................................................................................92
Bulleted and Numbered Lists...........................................................................................................92
Reformatting Bulleted and Numbered Lists...................................................................................94
Definition Lists....................................................................................................................................98
Removing and Deleting List Items...................................................................................................98
Character Formatting...............................................................................................................................99
Text Styles .........................................................................................................................................100
Fonts ..................................................................................................................................................101
Font Size............................................................................................................................................105
Font Color .........................................................................................................................................108
Character Formatting Behind the Scenes.....................................................................................108
Character Formatting Styles ...........................................................................................................109
Chapter 4: Introducing Cascading Style Sheets...................................113
Cascading Style Sheet Basics ................................................................................................................114
Why Use CSS?...................................................................................................................................114
Internal vs. External Style Sheets ...................................................................................................115
Types of Styles..................................................................................................................................116
vi Dreamweaver CS3: The Missing Manual
Creating Styles........................................................................................................................................117
Phase 1: Set Up the CSS Type........................................................................................................118
Phase 2: Defining the Style.............................................................................................................119
Using Styles.............................................................................................................................................120
Linking to an External Style Sheet .................................................................................................120
Applying a Class Style .....................................................................................................................122
Un-Applying a Class Style...............................................................................................................124
Manipulating Styles................................................................................................................................124
Editing Styles ....................................................................................................................................124
Deleting a Style ................................................................................................................................126
Renaming a Class Style...................................................................................................................127
Duplicating a Style...........................................................................................................................128
Checking Browser Compatibility..........................................................................................................129
Text Formatting with CSS......................................................................................................................131
Type Properties................................................................................................................................132
Block Properties...............................................................................................................................134
List Properties...................................................................................................................................137
Cascading Style Sheets Tutorial ...........................................................................................................139
Setting Up .........................................................................................................................................139
Creating an External Style Sheet....................................................................................................140
Using CSS Text Properties ..............................................................................................................143
Editing a Style...................................................................................................................................145
Creating a Class Style......................................................................................................................147
Attaching an External Style Sheet..................................................................................................149
Chapter 5:Links......................................................................................153
Understanding Links..............................................................................................................................153
Absolute Links..................................................................................................................................154
Document-Relative Links ................................................................................................................154
Root-Relative Links ..........................................................................................................................155
Link Types in Action ........................................................................................................................157
Executive Summary .........................................................................................................................159
Adding a Link..........................................................................................................................................159
Browsing for a File...........................................................................................................................159
Using the Point-to-File Tool............................................................................................................161
Typing (or Pasting) the URL or Path .............................................................................................163
Using the Hyperlink Object ............................................................................................................164
Adding an Email Link.............................................................................................................................165
Linking Within a Web Page...................................................................................................................167
Phase 1: Creating a Named Anchor..............................................................................................167
Phase 2: Linking to an Anchor.......................................................................................................169
Viewing and Hiding Anchors..........................................................................................................171
Modifying a Link.....................................................................................................................................171
Changing a Link’s Destination .......................................................................................................171
Removing a Link ..............................................................................................................................172
Styling Links ............................................................................................................................................172
CSS and Links...................................................................................................................................173
Table of Contents vii
Creating a Navigation Menu.................................................................................................................175
Adding a Menu.................................................................................................................................176
Adding, Editing, and Removing Links............................................................................................177
Changing the Look of the Menu....................................................................................................180
Link Tutorial ............................................................................................................................................185
Linking to Other Pages and Web Sites..........................................................................................185
Formatting Links ..............................................................................................................................187
Adding a Navigation Bar.................................................................................................................188
Styling the Menu Bar.......................................................................................................................193
Chapter 6: Images...................................................................................199
Adding Images........................................................................................................................................199
Adding an Image Placeholder........................................................................................................202
Inserting an Image from Photoshop....................................................................................................204
Method 1: Using the Insert Image Object ....................................................................................204
Method 2: Copying and Pasting from Photoshop.......................................................................208
Modifying an Image...............................................................................................................................208
Naming an Image ............................................................................................................................208
Adding a Text Description to an Image ........................................................................................209
Changing the Size of an Image ......................................................................................................210
Some Properties to Avoid...............................................................................................................212
Controlling Images with CSS.................................................................................................................213
Wrapping Text Around an Image ..................................................................................................213
Adding Borders ................................................................................................................................215
Background Images.........................................................................................................................217
Editing Graphics......................................................................................................................................219
The Built-In Editing Tools................................................................................................................219
Setting Up an External Editor .........................................................................................................222
Editing Images with Photoshop .....................................................................................................224
Editing Images with Fireworks .......................................................................................................225
Optimizing an Image .......................................................................................................................226
Image Maps.............................................................................................................................................226
Editing a Hotspot’s Properties........................................................................................................228
Rollover Images ......................................................................................................................................229
Flash Buttons...........................................................................................................................................231
A Warning About Flash ...................................................................................................................231
Adding a Flash Button to a Web Page ..........................................................................................232
Editing Flash Buttons .......................................................................................................................235
Previewing Flash Buttons................................................................................................................235
Flash Text.................................................................................................................................................235
Adding Flash Text to a Web Page ..................................................................................................236
Tutorial: Inserting and Formatting Graphics ......................................................................................238
Adding a Photo.................................................................................................................................239
Inserting a Rollover Image..............................................................................................................241
Using Background Images..............................................................................................................242
viii Dreamweaver CS3: The Missing Manual