Download as pdf or txt
Download as pdf or txt
You are on page 1of 7

Cheat Sheet

Dreamweaver CS5 All-in-


One For Dummies
From Dreamweaver CS5 All-in-One For Dummies
by Sue Jenkins, Richard Wagner
Dreamweaver CS5 can greatly improve productivity and
change the way you build Web sites. Knowing all the
important Dreamweaver CS5 keyboard shortcuts and common
HTML coding rules can boost your efficiency as a designer
even more. Find your way around the Dreamweaver
workspace with easy-to-remember keyboard shortcuts and
common coding hints so you can work faster and smarter, and
build your Web sites with greater ease.

Save Time with Dreamweaver CS5 Keyboard


Shortcuts
Using Dreamweaver CS5 is so much faster when you know the
shortcuts. Use these keyboard shortcuts in Design, Split, and Code
views to quickly create documents, perform editing tasks, hide and
show workspace features, apply simple formatting, edit code, make
selections, access Dreamweaver help, preview pages in Live View
and in a browser, and more.

Keyboard PC Shortcut Mac Shortcut


Commands

Create a new Control+N Command+N


document

Open an Control+O Command+O


existing
document

Save an open Control+S Command+S


document

Close an Control+W Command+W


open
document
Close all Control+Shift+W Command+Shift +W
open
documents

Exit/Quit Control+Q or Alt+F4 Command+Q or Opt+F4


Dreamweaver

Undo Control+Z or Option+Delete


Alt+Backspace

Redo Control+Y or Command+Y or


Control +Shift+Z Command+Shift+Z

Cut Control+X or Command+X or


Shift+Delete Shift+Delete

Copy Control+C Command+C

Paste Control+V Command+V

Paste special Control+Shift+V Command+Shift+V

Select all Control+A Command+A

Find and Control+F Command+F


replace

Open the Control+U Command+U


Preferences
panel

Show/hide Control+Alt+R Command+Option+R


rulers

Show/hide Control+; Command+;


guides

Show/hide Control+Shift+I Command+Shift+I


visual aids

Show/hide Control+Alt+G Command+Option+G


grid

Edit page Control+J Command+J


properties

Refresh F5 F5
Design view

Make Control+B Command+B


selected text
bold

Make Control+I Command+I


selected text
italic

Apply Control+Shift+P Command+Shift+P


paragraph
formatting to
selected text

Apply Control+1 through 6 Command+1 through 6


heading
formatting
(H1–H6) to
selected text

Add new Return Return


paragraph

Add a line Shift+Return Shift+Return


break <BR>

Insert a Command+Shift+Spacebar Command+Shift+Spacebar


nonbreaking
space

Move object Drag selection to new Drag selection to new


or text location location

Copy object Control-drag selection to Option-drag selection to


or text new location new location

Select a word Double-click Double-click

Select a row Triple-click Triple-click


or text block

Insert image Control+Alt+I Command+Option+I

Insert table Control+Alt+T Command+Option+T

Run a spell Shift+F7 Shift+F7


check

Open the F1 F1
Help window

Zoom in Control+= Command+=

Zoom out Control+- Command+-

Preview in F12 Option+F12


primary
browser

Preview in Shift+F12 or Control+F12 Command+F12


secondary
browser

Live View Alt+F11 Option+F11

Freeze F11 F11


JavaScript

Inspect Alt+Shift+F11 Option+Shift+F11

Code Control+Alt+N Command+Option+N


Navigator

Get Control+Shift+D Command+Shift+D

Put Control+Shift+U Command+Shift+U

Check in Control+Alt+Shift+U Command+


Option+Shift+U

Check out Control+Alt+Shift+D Command+


Option+Shift+D

HTML, CSS, and JavaScript Code Hints


As a Web designer, you use some bits of HTML, CSS, and JavaScript
code frequently but not often enough to commit to memory. The
following HTML code, CSS style, and JavaScript hints are handy
when you are adding special elements such as null links, meta
tags, and entities to your pages. Use these HTML, CSS, and
JavaScript code hints in Code view, the Properties inspector, and
your CSS style sheets.

HTML Code Code Shortcut


Hint

Create a null # or javascript:; or javascript:void(0) as in<a


link href=" #" >link</a>
<a href=" javascript:;" >link</a>
<a href=" javascript:void(0)" >link</a>

Create named Link to Target


anchor link <a href=" #anchorname" >link</a>
Target
<a name=" anchorname" ></a>

Create link to <a


named anchor href=" otherpage.html#anchorname" >link</a>
in another page
Insert line <br />
break

Close window <a href=" javascript:window.close();" >Close


JavaScript This Window</a>

Revisit after x <meta name=" revisit-after" content=" 5 days"


days meta tag />

No cache meta <meta http-equiv=" pragma" content=" no-


tag cache" >

Meta link to <link rel=" Index" href=" index.html" />


home page

Meta link to <link rel=" Site Map" href=" sitemap.html" />


sitemap page

Meta link to <link rel=" Shortcut Icon" href=" favicon.ico"


shortcut icon />

Meta link to <link rel=" Shortcut Icon" type=" image/gif"


shortcut icon href=" favicon.gif" />
using GIF
instead of ICO

Link to external <script src=" myjsfile.js"


JS file type=" text/javascript" ></script>

Link to external <link rel=" stylesheet" type=" text/css"


CSS href=" css/ie.css" media=" screen" />

Import@ link to <style media=" all" type=" text/css" >


external CSS @import " css/all.css" ;
</style>

CSS link for IE <!--[if lt IE 7]><link rel=" stylesheet"


browsers less type=" text/css" href=" ie.css"
than IE 7 media=" all" /><![endif]

Insert an image <img src=" images/myfile.png" alt=" My File"


with ALT />
attribute

Empty ALT <img src=" images/myfile.png" alt=" " />


attribute for
image

Entity to add &nbsp; or &#160;


blank space

Entity to add &copy; or &#169;


copyright
Entity to add &trade; or &#153;
trademark

Entity to add &amp; or &#38;


ampersand

Add NoScript <noscript>…


tags

Link targets _blank


_new
_self
_parent
_top

Apply CSS <span class=" stylename" >…


custom style
with SPAN tags

Comment tags <!-- Your comment here //


in HTML and
JavaScript

Comment tags /* Your comment here */


in CSS

Structure of a tag {
CSS tag attribute: value;
redefine style }

Structure of a #ID {
CSS ID style attribute: value;
}

Structure of a .stylename {
CSS custom attribute: value;
style }

CSS for link a:link {


styles attribute: value;
}
a:visited {
attribute: value;
}
a:hover {
attribute: value;
}
a:active {
attribute: value;;
}
Copyright © 2010 & Trademark by Wiley Publishing, Inc. All rights reserved.

You might also like