HTML5 Digital Classroom

Lesson 11: Styling with CSS3

In this lesson, you will learn to use CSS3 properties that enhance web pages with styling, such as rounded corners, border images, gradients, transparent colors, and animation.

What you’ll learn in this lesson:

• • Working with the border-radius and border-image properties
• • Using vendor-specific prefixes
• • Adding multiple background images
• • Creating CSS gradients
• • Creating CSS animations targeted for WebKit browsers, such as Mobile Safari for the iPhone and iPad

Starting up

You will work with several files from the HTML5_11lessons folder in this lesson. Make sure you have loaded the HTML5lessons folder onto your hard drive from www.digitalclassroombooks.com/HTML5. See “Loading lesson files” in the Starting Up section of this book.

To accurately preview the HTML5 content you will create in this lesson, you need a browser that supports HTML5 tags. See “Using web browsers that support HTML5 tags” in the Starting Up section of this book to determine whether you are using such a browser, or for instructions on downloading one.

Understanding the role of CSS3

Cascading Style Sheets is a separate language from HTML, and the W3C specification that details the features and rules of CSS has its own timeline. The original CSS1 specification became a W3C recommendation in 1996; the CSS2 specification became a W3C recommendation in 1998; and an updated version, ...