This document discusses CSS3 features including border-radius for rounded corners, box-shadow and text-shadow for drop shadows, background properties like background-size and origin, and @font-face for custom web fonts. Examples are provided for border-radius, box-shadow, text-shadow, background-size, background-origin, and background-clip properties to demonstrate how to implement these CSS3 features.

1. WEB DESIGN

2. CSS
CSS3 Introduction1
2
Box shadow3
5
Border radius2
4

3. CSS3 Introduction

4. Rounded Corners
border-radius
Example:
border-radius: 25px;
border-radius: 25px;
Border-top-left-radius
Border-top-right-radius
Border-bottom-right-radius
border-bottom-left-radius

5. Box shadow
text-shadow
Box-shadow
text-shadow: 2px 2px red;
text-shadow: 2px 2px 5px red;
box-shadow: 10px 10px;
box-shadow: 10px 10px grey;
box-shadow: 10px 10px 5px grey;

6. CSS3 Background
background-size
background-origin
Background-clip
background-size: 100px 80px;
background-origin: content-box;
background-clip: content-box;

7. CSS3 Font
@font-face {
font-family: myFirstFont;
src: url(sansation_light.woff);
font-weight: bold;
}

8. THANK YOU