CSS3 Transitions and Styles

dw07.psd 

Dreamweaver CC supports a number of CSS3 styles including CSS3 Transitions, Gradients and rounded borders for upgrading the style and appearance of your site. CSS3 Transitions add a way to create basic animations using CSS properties such as background-color and size to add interactivity to your website.

What you’ll learn in this lesson:

  • The role of CSS3 in Dreamweaver CC
  • Creating a CSS Transition
  • Creating a CSS Gradient
  • Creating rounded borders

Starting up

Before you begin, reset your workspace to ensure your tools and panels are consistent. For more information, see “Resetting the Dreamweaver workspace” in the Starting up section of this book.

In this lesson, you will work with several files from the dw07lessons folder. Make sure that you have loaded the dwlessons folder onto your hard-drive from www.digitalclassroombooks.com/epub/dreamweavercc. For more information, see “Loading lesson files” in the Starting up section of this book.

Before you can proceed with the exercises in this section, you need to create site settings that point to the dw07lessons folder. Go to Site > New Site, or for details on creating a site, refer to Lesson 2, “Setting Up a New Site.”

Understanding the role of CSS3

Cascading Style Sheets is a separate language from HTML; however, both languages are constantly evolving. The original CSS1 specification was released ...

Get Dreamweaver CC Digital Classroom now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.