Как сделать тень картинки в css

Чтобы добавить тень к картинке в CSS, можно использовать свойство box-shadow. Вот пример кода:

HTML:

<img src="path/to/image.jpg" alt="Описание изображения" class="shadow-image">

CSS:

.shadow-image {
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); /* задаем тень смещением и прозрачностью */
}

В этом примере картинка будет отображена с тенью, которая задана через свойство box-shadow. Значение 5px устанавливает расстояние тени от элемента вправо и вниз, 10px задает размер размытия тени, а rgba(0, 0, 0, 0.5) — цвет тени и ее прозрачность.

Также можно задать другие параметры тени, такие как цвет, интенсивность, угол и т.д. Например:

.box-shadow {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1),
              0 1px 3px rgba(0, 0, 0, 0.08); 
  /* Задаем несколько теней с разными параметрами */
}

В этом примере заданы две тени, первая с более высокой интенсивностью и меньшим размером размытия, вторая — менее интенсивная и с большим размером размытия.

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как сделать тень картинки в css

Наш специалист свяжется с вами в ближайшее время и уточнит детали