уголки

Таблицы на веб-странице всегда имеют прямоугольную форму, изменить которую невозможно, но за счет использования фоновых изображений таблице допустимо придать желаемый вид, в частности придать закругления уголкам.

Скругленные уголки нынче в моде и способны украсить любую веб-страницу, поэтому закругления добавляют к любым элементам веб-страницы, включая таблицы. В CSS нет стандартного штатного средства по созданию уголков, так что нам придется обратиться к изображениям.

Любые слои на веб-странице по своему определению прямоугольны, поэтому блоки, которые они формируют, имеют такую же форму. Однако с помощью изображений к любому блоку можно добавить один, два или даже четыре декоративных уголка. Далее рассмотрим вариант создания блока с двумя верхними скругленными уголками.

Для создания рамки вокруг блока используется стилевой атрибут border, в качестве значения которого задается толщина, стиль и цвет линии. Если поверх такой линии наложить графические уголки, то мы убьем двух зайцев — получим нужные закругления и сохраним границу, которую можно увидеть даже при отключении картинок.

Закругленные уголки достаточно часто применяются в дизайне, однако в CSS пока нет штатного универсального средства для их добавления. Поэтому приходится использовать различные ухищрения, чтобы добиться желаемого результата. Преимущественно для создания уголков применяются изображения, поэтому интересно будет обойтись без них, только с помощью стилей.

Если на сайте применяется группа фотографий одинаковой ширины и высоты, то для них достаточно просто можно установить скругленные уголки. Принцип состоит в том, что поверх каждой фотографии накладывается рисунок, который прячет под собой часть фотографии, образуя тем самым желаемые уголки.