Для создания теней для элементов с закруглёнными углами можно использовать свойство border-radius в CSS. 13 Оно устанавливает радиус скругления уголков рамки. 1

Некоторые возможности свойства:

• Одно значение. 1 Устанавливает единый радиус для всех четырёх уголков. 1
• Два значения. 1 Первое задаёт радиус верхнего левого и нижнего правого уголка, второе — верхнего правого и нижнего левого. 1
• Три значения. 1 Первое устанавливает радиус для верхнего левого уголка, второе — одновременно для верхнего правого и нижнего левого, а третье — для нижнего правого уголка. 1
• Четыре значения. 1 По очереди устанавливают радиус для верхнего левого, верхнего правого, нижнего правого и нижнего левого уголка. 1

Свойство box-shadow добавляет тень к элементу. 15 Тень представляет собой копию элемента, смещённую на указанное расстояние. 5 Если для элемента с тенью задан border-radius, то отбрасываемая тень также будет с закруглёнными углами. 3

Некоторые параметры свойства box-shadow:

• x-offset. 5 Задаёт горизонтальное смещение тени. 5 Положительное значение рисует тень, смещённую вправо от текста, отрицательная длина — влево. 5
• y-offset. 5 Задаёт вертикальное смещение тени. 5 Положительное значение смещает тень вниз, отрицательное — вверх. 5
• blur. 5 Задаёт радиус размытия. 5 Отрицательные значения не допускаются. 5 Если значение размытия равно нулю, то край тени чёткий. 5 В противном случае, чем больше значение, тем больше размыт край тени. 5
• растяжение. 5 Задаёт расстояние, на которое тень увеличивается. 5 Положительные значения заставляют тень расширяться во всех направлениях на указанный радиус. 5 Отрицательные значения заставляют тень сжиматься. 5
• цвет. 5 Задаёт цвет тени. 5 Если цвет отсутствует, используемый цвет берётся из свойства color. 5