Вместо того, чтобы стирать слезы с лица, сотрите из жизни людей, которые заставили вас плакать.
30-ноября-2023, 20:35 1 0
Эти рождественские элементы в виде простых смайлов оформленных при помощи CSS помогут вам создать праздничное настроение на вашем веб-ресурсе в преддверии новогодних праздников. Тень добавляет эффект глубины. Вы можете изменить их размер и непрозрачность. Так же можно сменить позиционирование. Это быстрый способ добавить рождественскую графику с помощью смайлов, таких как ёлка, дед Мороз (Санта Клаус) и коробка с подарком. Неоспоримым преимуществом является то, что вам не нужно рисовать никаких дополнительных значков.
HTML
<div class="text">🎅</div>
<div class="text">🎄</div>
<div class="text">🎁</div>
CSS
:root {
--background: #c0c0c0;
--backgroundShadow: -6px 6px 15px rgba(0,0,0,0.5);
--textshadow: 6px -6px 15px rgba(255,255,255,0.8);
}
body {
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background: var(--background);
}
.text {
color: var(--background);
font-size: 8em;
font-weight: bold;
position: relative;
font-family: sans-serif;
text-transform: uppercase;
text-shadow: var(--backgroundShadow),
var(--textshadow);
}