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 Adobe Edge Fonts

  • We are going to work with an Adobe Edge Font and add it to our inner.html page for the header
  • Go to Modify->Manage Fonts and select the Adobe Edge Web Fonts tab
  • We will be modifying the font for the Tranquil Travel text within our header area
  • Choose a web font from Adobe Edge, I will use the Bree Serif font
  • Select the font you want to use, it gets a green checkmark, and choose Done
  • Dreamweaver adds it to the available fonts on the system so we can add it to a custom font stack of our own
  • Set up a font stack for bree-serif and Serif as the font family
  • We will set this new font as the font for the logo class for the Tranquil Travel text in the header
  • Select the .logo class in CSS Designer and change the font to this new font stack
  • Change the font size to 3.2em for the logo class
  • Go into the code to view the script tag for the logo class in the stylesheet code
  • Dreamweaver adds some script information in the head area of the web page within 2 separate script tags under the comment that mentions Adobe Edge Web Fonts
  • We did not have to create any of that script code in order to work with these fonts on our page

Working with Adobe Edge Fonts

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
  • Inner Page 0:44
  • Logo Class 1:54
    • Text Area
  • Adding Adobe Edge 3:08
    • Manage Fonts
    • Adobe Edge Web Fonts Tab
    • Filtering
  • Applying Text 6:02
    • Preview in Live View
    • Preview in Code View
    • Source Code
    • Java Script