Как сделать тень на кнопке css

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

Вот пример кода для добавления тени на кнопку:

button {
  background-color: #3498db;
  color: #fff;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  box-shadow: 0px 5px 5px rgba(0, 0, 0, 0.2);
}

Здесь мы задали синий цвет фона и белый цвет текста для кнопки, а также добавили отступы внутри кнопки с помощью свойства padding. Мы также задали радиус скругления углов с помощью border-radius и убрали рамку вокруг кнопки с помощью border: none.

Наиболее важным здесь является свойство box-shadow, которое создает тень на кнопке. Значения, указанные для этого свойства, задаются в следующем порядке:

• горизонтальное смещение (количество пикселей вправо или влево)
• вертикальное смещение (количество пикселей вниз или вверх)
• размер размытия тени
• цвет тени (задается в формате RGBA)

В нашем случае мы установили горизонтальное и вертикальное смещение в 0, что означает, что тень будет расположена прямо под кнопкой. Мы также установили размер размытия тени равным 5 пикселей и цвет тени определен как rgba(0, 0, 0, 0.2), что создает непрозрачную чёрную тень с небольшим прозрачностью (0,2).

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