Unit Three: pg 3-4

advertisement
Student Name: ______________________
Chapter 3 Dreamweaver Check off sheet
Unit Three: pg 3-4 - Striped Umbrella
Lesson1 pg 3-4 Create an unordered List
Open spa page- add bullets to items under Skin care treatments (figure 3)
Create bulleted list under Body Treatments, Massages and Spa Packages headings
Pressing enter will add another bulleted item. Pressing enter twice will end bullets
Lesson 1 pg 3-7 Format an Unordered List
Click in the Revitalizing facial paragraph go to properties > click on list item (figure 5)
change to a square
Lesson 1 pg 3-8 Create an ordered List
Important Click on Edit > Preferences > uncheck the Use CSS instead of HTML box
before importing text
Click after 5:00 pm at the end of the page Import > Word Document > Questions
(remember question document in Dreamweaver database files) Command > Clean
up code.
Click to the left of “Questions you may have” Insert (menu bar) > HTML > Horizontal
Rule
Select How do I schedule > click Ordered List in the property panel Figure 6
Lesson 1 pg 3-9 Format ordered List
Select all text below the line –change to Arial, Helvetica sans serif, size 3
Bold the Questions you may have Change the color to a dark blue
Lesson 2 pg 3-10 - Style Sheets- Create a Cascading Style Sheet
Important Click on Edit > Preferences > check the Use CSS instead of HT
Pg 3-12 – Create the .bullet style save in a style sheet named su_styles.css file
see figures 11 & 12
Pg 3-14 Apply a Cascading Style Sheet
Important Click on view > Toolbars > Style Rending Toolbar be sure toggle switch is
on (it will have an outline around the button)
Highlight Revitalizing Facial – remove all formatting > click style in properties panel
and apply the bullets style – do for all the bullet points on page
Pg 3-15 Edit a Cascading Style Sheet
-
Click on .bullets in the css style panel > Edit Style (the pencil) Change font size to 14
Lesson 3 Adding Styles and Attaching Styles
Pg 3-18 Add a style to a Cascading Style Sheet spa page
-
Add a heading style to your su_styles.css figures 20, 21, 22 (Arial, size 16, style
normal, weight bold and color dark blue , center (in the block category)
Add a body_text style to your su_styles.css (Arial, size 14, normal style)
Pg 3-19 Attach a style sheet – to index page- body text to home page
Lesson 4 -insert align graphics
-
Open dw3_1.html – save as about_us.html -
-
Attach the su_styles.css style sheet to the page – apply body text to all text on page
-
Insert club_house.jpg, boardwalk.jpg, Pool.jpg, sago_palm.jpg and sports_club.jpb
to each paragraph – insert appropriate alternative text to each picture
Align the images – left and right see pg 3-25 figure 32 for final layout
-
Lesson 5- Enhance image
Pg 3-28 Add a border – add a border of 1 to all pictures
S
T
Student Name: ______________________
Add horizontal space – add 7 to the v space and the h space to add some white space around
all the pictures
3-29 – brighten up the boardwalk picture
Blooms Unite Three 3-38 (finished example: pg 3-39)
Create unordered and Ordered lists on Tips page
Tips page – unordered list (Fall, Winter, Spring, Summer)
Text below basic gardening tips – Add an Ordered lists
Create, apply and edit CSS Sheet
Create new CSS rule – name .seasons see book for step 3 for settings – save as
blooms_styles.css
Apply new seasons style to fall, winter, spring and summer
Add styles and attach css sheets
Add a headings style – See step #1 for settings
Apply heading to Seasonal Gardening Checklist and Basic Gardening Tips Insert and Align Images
Open dw3_2.html – save as plants.html
-Insert Petunias - align left – add alt text
-insert Verbena align right – add alt text
-insert lantana align left – add alt text
-Add a 1 pixel border to all pictures and add 20 pixels of horizontal spacing – check
work in browser window
-Open tips page – add h space 10 and v space 10 to garden tips graphic
Trip Smart Unit Three 2-36 (finished example: pg 3-41)
Create unordered and Ordered lists on Tips page
Open dw3_3.html – save as newsletter.html
Create new css rule body_text save as tripsmart_styles.css
Use whatever size, color font you like for your body_text style
Create a Heading css rule. Choose own look for heading apply to Ten Packing
Essentials
Title the page – Travel Tidbits
Open dw3_4.html save as destinations.html
Add Zebra_mothers picture, add lion picture – align the image add h and v
space until looks good (see example on pg 3-41 figure 49)
Apply your heading style Destination Kenya and body text style to rest of text
Page title – Destination: Kenya
Carolyne’s Creations- 3-43
-
(finished example: pg 3-43)
Open dw3_5.html save as recipes.html
Format list of ingredients as an unordered list
Create new css rule named body_text and save style as cc_styles.css
Use whatever formatting you like – apply to all text except Cranberry and
directions
Create a new css rule named heading use your own style for the headings
apply to Cranberry Ice and Directions
Insert picture cranberry_ice.jpg – add h space 30 v space 10
Open dw3_6.html save as shop.html
Attach the cc_style.css – create a new style sub_head format “January Specials
Apply body_text style to the rest of the text on the page
Insert pot_knives.jpg – align and add spacing to make it look nice
Download