committed to shaping the next generation of it experts. 1 essentials for design dreamweaver level...
TRANSCRIPT
1Committed to Shaping the Next Generation of IT Experts.
Essentials For DesignDreamweaver
Level OneJulian Rickards
Project 3
Applying Structure To Text
Copyright (c) 2004 Prentice-Hall. All rights reserved. 2
Applying Structure To Text
Structure a document with headings
Insert line breaks format quotations with HTML tags
Horizontal rule Use ordered and
unordered lists Change bullet and
number styles with CSS
Create definition lists
Copyright (c) 2004 Prentice-Hall. All rights reserved. 3
Visual Summary
Text Insert bar Access to HTML tags to
structure text
Copyright (c) 2004 Prentice-Hall. All rights reserved. 4
Visual Summary (continued)
Other HTML characters Located at right end of “text
insert” bar
Copyright (c) 2004 Prentice-Hall. All rights reserved. 5
Visual Summary (continued)
Property inspector Used very frequently
Copyright (c) 2004 Prentice-Hall. All rights reserved. 6
Visual Summary (continued)
Code hint pop-up list
Copyright (c) 2004 Prentice-Hall. All rights reserved. 7
Inserting Headings
Deprecated In favor of CSS
Copyright (c) 2004 Prentice-Hall. All rights reserved. 8
Insert Headings Using The Insert Bar
Copyright (c) 2004 Prentice-Hall. All rights reserved. 9
Insert Headings Using The Insert Bar (Continued)
Copyright (c) 2004 Prentice-Hall. All rights reserved. 10
Inserting Line Breaks
Forces new line Addresses Other block text
Click in the empty paragraph space between the Heading 3 lines Mailing Address: and Phone Numbers:
Copyright (c) 2004 Prentice-Hall. All rights reserved. 11
Inserting Line Breaks (continued)
Copyright (c) 2004 Prentice-Hall. All rights reserved. 12
Inserting Line Breaks – Alternate
Using Design view
Copyright (c) 2004 Prentice-Hall. All rights reserved. 13
Formatting A Large Quotation On A Web Page
Blockquote <blockquote><p>…</p></blockquote>
Default indentation “Cite” tool for quotation source
Copyright (c) 2004 Prentice-Hall. All rights reserved. 14
Formatting An InsertedBlock Quote
By using the Property inspector
Copyright (c) 2004 Prentice-Hall. All rights reserved. 15
In The Design View
Copyright (c) 2004 Prentice-Hall. All rights reserved. 16
Using The “Cite” Tool
Copyright (c) 2004 Prentice-Hall. All rights reserved. 17
Using The “Cite” Tool (continued)
Copyright (c) 2004 Prentice-Hall. All rights reserved. 18
Inserting A Short Quotation In A Paragraph
Quote tag <q>
Double quotes W3C
CSS
Copyright (c) 2004 Prentice-Hall. All rights reserved. 19
Tag Chooser
Copyright (c) 2004 Prentice-Hall. All rights reserved. 20
Tag Editor
Copyright (c) 2004 Prentice-Hall. All rights reserved. 21
Browser Preview
Copyright (c) 2004 Prentice-Hall. All rights reserved. 22
Separating Content Using A Horizontal Rule
Horizontal rule tag, <hr> Width Color Noshade Size
Block element
Copyright (c) 2004 Prentice-Hall. All rights reserved. 23
Insert A Horizontal Rule
Copyright (c) 2004 Prentice-Hall. All rights reserved. 24
Creating Ordered AndUnordered Lists
Ordered Numbered
Unordered Bulleted
1. One
2. Two
3. Three
Two
One
Three
Copyright (c) 2004 Prentice-Hall. All rights reserved. 25
Ordered List
Two tags <ol>
Ordered list <li>
List item Pair needed for
each item
Copyright (c) 2004 Prentice-Hall. All rights reserved. 26
Unordered List Two tags
<ul> unordered list
<li> List item Pair needed for
each item
Code view
Copyright (c) 2004 Prentice-Hall. All rights reserved. 27
Styling Lists
Ordered Various numbered
Unordered Various bulleted
1. One
2. Two
3. Three
a) One
b) Two
c) Three
A. One
B. Two
C. Three
o Two
o One
o Three
Two
One
Three
Two
One
Three
Copyright (c) 2004 Prentice-Hall. All rights reserved. 28
CSS Style Definition
Copyright (c) 2004 Prentice-Hall. All rights reserved. 29
Creating Definition Lists
Needs three tag sets <Dl>…</dl> definition list <dt>…</dt> definition term <dd>…</dd> definition description
Copyright (c) 2004 Prentice-Hall. All rights reserved. 30
Definition Lists – Code View
Copyright (c) 2004 Prentice-Hall. All rights reserved. 31
Summary
Structure a document with headings
Insert line breaks format quotations with HTML tags
Horizontal rule
Use ordered and unordered lists
Change bullet and number styles with CSS
Create definition lists
Copyright (c) 2004 Prentice-Hall. All rights reserved. 32
End-of-Project Exercises
Screen ID Multiple Choice Discussion Questions Skill drill
Create Heading Using the Property Inspector Create Unordered Lists Create and Modify the Style of an Ordered
List Create a Nested List Insert Special HTML Characters
Copyright (c) 2004 Prentice-Hall. All rights reserved. 33
End-of-Project Exercises (continued)
Challenge Format Heading in the Drummond Reid Web
Pages Insert a Horizontal Rule Divider above the Footer Covert a Paragraph Break to a Line Break Reformat Text as Unordered and Ordered Lists Change the Numbering Style of an Ordered List
Portfolio Builder Create an Online Resume
Copyright (c) 2004 Prentice-Hall. All rights reserved. 34
What Are Your Questions