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 Educator.com

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!

Working with Rules on the Page

  • We will create internal style rules for the about us page for our website
    • Create a new page called about-us.html
    • Open about-us.txt file within the text folder
    • Copy the text and paste it onto the new about-us.html page
  • We will look over the structure and begin to create styles for this page
  • Add the title About Tranquil Travel and save the page
  • Copy the title onto the page and convert it to an H1
  • Note what happens when we do that, the entire content becomes an H1
  • We need to add P tags to the content first
  • Use ctrl/cmd-z to undo
  • Make 3 paragraphs and an H1 on the page
  • We will start by creating a style for the h1 tag
  • Open CSS Designer by going to Window->CSS Designer
    • Click the + in the Sources area of CSS Designer in the CSS styles panel and choose Define in Page
    • With the <style> tag selected in the Sources panel, click the + in the Selectors area of CSS Designer and type H1
    • Move to the Properties area widening this panel as needed and click the Text icon
    • Choose a font-family from the list and add any additional styles you want
    • As we add properties within the Properties area, Dreamweaver takes care of adding all the proper brackets, colons, semi-colons and other syntax needed to create a perfect rule
    • Add styles and complete the H1 rule
  • Use the same method to add internal/embedded styles for the p tag

Working with Rules on the Page

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
  • .txt Versus .rtf File 0:56
    • Copy/Paste
    • Header 1
  • Undoing Header 1 Style 2:53
    • Adding <p>
    • <p> Shortcut
  • Adding Styles 4:50
    • CSS Designer
    • Sources Panel
    • Define in Page
  • Adding Selector 6:43
    • Properties
  • Modifying Text 8:10
    • Color
    • Font Family
    • Font Size
    • Em Unit
    • Font Size
    • Body Font Size