Урок 3. Курс по CSS3. Закругленные углы и рамки для блоков в CSS3

От автора: раньше, если нам нужно было у какого-либо блока на сайте сделать закругленные углы, выделить рамку, вокруг блока с закругленными углами, то необходимо было для этого вырезать 2 или 3 картинки. А если блок с закругленными углами должен был растягиваться и по ширине (резиновая верстка), то необходимо было, в самом худшем случае, целых 8 картинок. И, конечно, это требовало дополнительной html разметки. Сегодня мы можем, используя css3, делать закругленные углы, а также задавать свое собственное изображение для рамки блока, написав всего несколько строк кода.

По результатам урока вы научитесь задавать радиус скругления углов для различных сторон элемента, в том числе по горизонтали и вертикали, поймете, каким образом работает свойство border-image-slice, которое указывает каким образом должна разрезаться картинка для установки ее в качестве рамки, и закрепите все пройденные свойства на примерах.

Все уроки курса:

Метки: Курс по CSS3