Web Design Course - Lecture 11 - CSS3, Border radius, Box shadow

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