Тень. (box-shadow)

Очень популярное свойство, которое приукрасит ваш сайт – это тень.
Рассмотрим ее на примере.

Задача:
У вас есть блок

<div></div>

, вы хотите вокруг него тень.

Решение:
– присваиваем блоку класс

<div class="shadow"></div>

– пишем стиль box-shadow: 0 0 10px rgba(0,0,0,0.5);
где box-shadow – собственно и есть тень,
0 0 10px – смещение по Х, смещение по Y, и тольщина тени
rgba(0,0,0,0.5) – как уже понятно, цвет тени.

И теперь все вметсе

1
2
3
4
5
6
7
8
<style>
	.shadow{
		box-shadow: 0 0 10px rgba(0,0,0,0.5);
	}
</style>
<div class="shadow">
	БЛОК С ТЕНЬЮ
</div>

Добавить комментарий