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 Photoshop Designs to Code
  • Discussion

  • Study Guides

  • Table of Contents

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!

Customizing Text with CSS

  • We will add CSS rules to format our text so it will match the graphic design text
  • All text starts as the default text from the operating system default
  • We can customize the text properties using CSS
  • We are using 2 fonts within this design other than the logo font
  • Minion Pro-upperContent & lowerColHeaders which is a serif font
  • Myriad Pro-nav & lowerColText sans-serif font
  • We must decide how we are going to handle our fonts & which we really want to use on the web
  • If someone does not have these fonts, the design will not look identical to ours
  • These are Adobe fonts, so anyone with the Adobe suite will have these installed
  • Most users will not have these fonts
  • So how can we handle this
  • We can use other fonts & adjust them using CSS to try & make them look similar to what we want
  • Or we can set up the page so it will search for these fonts first, and then if the user does not have them, set up the page with another font that every user will have
  • We will add the Minion Pro font using a font stack we create in Dreamweaver
  • Go through the Edit Font feature in Dreamweaver for Minion Pro, Georgia, serif
  • For Myriad Pro, we will use Lucida & adjust the font