Sign In | Subscribe
Start learning today, and be successful in your academic & professional career. Start Today!
Loading video...
This is a quick preview of the lesson. For full access, please Log In or Sign up.
For more information, please see full course syllabus of Adobe Dreamweaver CC
  • Discussion

  • Study Guides

  • Download Lecture Slides

  • Table of Contents

  • Related Books

Bookmark and Share

Start Learning Now

Our free lessons will get you started (Adobe Flash® required).
Get immediate access to our entire library.

Sign up for

Membership Overview

  • Unlimited access to our entire library of courses.
  • Search and jump to exactly what you want to learn.
  • *Ask questions and get answers from the community and our teachers!
  • Practice questions with step-by-step solutions.
  • Download lesson files for programming and software training practice.
  • Track your course viewing progress.
  • Download lecture slides for taking notes.
  • Learn at your own pace... anytime, anywhere!

Building the Header Area

  • We are going to customize the header area on the page
  • The present page has a logo image within a hyperlink
  • We will delete this content and become familiar with how to use the tag selector
    1. Place your cursor in the header area
    2. Select the <img#Insert_logo> tag in the Tag Selector to select the image in the header area
    3. Select the image in the header area and hit the delete key
    4. That deleted the content within the header tag
  • We will now add an image for the header within the header area using the CSS Designer panel
  • Add the image header-no-nav.jpg
  • Dreamweaver has no auto-save feature (for good reason) so you must save your page as you complete specific pieces of work
  • Preview the page in the browser

Building the Header Area

Lecture Slides are screen-captured images of important points in the lecture. Students can download and print out these lecture slide images to do practice problems as well as take notes while watching the lecture.

  • Intro 0:00
  • Setting Up Interface 0:28
    • Properties
    • Tag Selector
    • Expanding Files Tab
    • Collapsing Files Tab
  • Tag Selector 1:53
    • Example: Insert Logo
    • Body Tag
    • Placeholder
    • Header Tag
  • Changing Background Color 5:26
    • CSS Designer Panel
    • Determining Header CSS Rule
  • Header Properties 6:18
    • Properties Icons
    • Background Color
    • Inserting Image