CSS 3 (каскадные таблицы стилей)

Создавать элементы со сглаженными углами;
Создавать линейные и сферические градиенты;
Более гибко оформлять

Закругленные углы

1.#1 {border-radius:10px;}
2.#2 {border-radius:50%;}
3.#3 {border-radius:25px 5px;}
4.#4 {border-radius:40px 30px 20px 10px;}

Задание цвета с помощью HSL

Пример

#wrap1 {background-color:hsl(0,30%,50%);}
#wrap2 {background-color:hsl(120,100%,80%);}
#wrap3 {background-color:hsl(240,100%,50%);}

Тень текста

1.#1 {text-shadow:rgba(0,0,0,0.5) 1px 1px 0;}
2.#2 {text-shadow:rgba(0,0,0,0.7) 5px 5px 3px;}
3.#3 {text-shadow:rgba(45,35,200,0.7) -10px -10px 3px;}

#el1 {box-shadow:4px 4px black;}
#el2 {box-shadow:6px 6px 6px 2px black;}
#el3 {box-shadow:0px 0px

#wrap1 {
background-image: url(wislink.gif),url(mountimg3.jpg);
background-position:bottom right, center;
background-size:150px 40px,100% 100%;
background-repeat:no-repeat,no-repeat;}

Несколько фоновых изображений

#wrap1 {background:linear-gradient(top,white,black);}
#wrap2 {background:linear-gradient(left,white,black);}
#wrap3 {background:linear-gradient(0deg,white,black);}
#wrap4 {background:linear-gradient(270deg,white,black);}

Линейные градиенты

Примеры

#wrap1 {background:linear-gradient(top,white 0%,green 50%,black 100%);}
#wrap2 {background:linear-gradient(left,#8F04A8 0%,#7CE700 60%,#FFE100 100%);}

Цветовой градиент

Сферические градиенты