Можно ли сделать такую тень универсально?
Можно ли сделать тень, как на картинке, универсальной, чтобы она автоматически применялась к любому указанному в теге числу? Мне пришла в голову только банальная реализация через ::before, но там нужно конкретное значение указывать, следовательно для каждой карточки будет свой отдельный прописанный ::before для каждого числа.
Дополнительно:
1) В чем сложность сделать это обычной тенью?
2) Можно через before выводить значение атрибута функцией attr()
snippet
- Спасибо!
Накинул атрибуты, содержащие текстовое значение блока, при помощи JS и через ::after сделал тень таким способом. Получилось универсально для всех новых блоков.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Да, можно создать универсальную тень, которая будет работать на различных элементах веб-страницы. Для этого можно использовать CSS свойство box-shadow. Box-shadow позволяет добавить тень к любому элементу на веб-странице.
Пример использования box-shadow для создания универсальной тени:
.shadow { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Горизонтальное смещение, вертикальное смещение, размытие, цвет тени */ }
В данном примере у элемента с классом "shadow" будет добавлена тень, которая будет иметь горизонтальное смещение 0, вертикальное смещение 2px, размытие 4px и цвет тени rgba(0, 0, 0, 0.1) - черный цвет с небольшой прозрачностью.
Вы можете настроить параметры тени (горизонтальное и вертикальное смещение, размытие, цвет) в соответствии с вашими потребностями. Таким образом, данный код можно использовать для создания универсальной тени на различных элементах веб-страницы.
Надеюсь, это поможет вам создать универсальную тень на вашем веб-сайте. Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать их.