Зміст курсу
Основи CSS
Основи CSS
Тіні
Ми можемо використовувати тіні для створення візуального ефекту, коли елемент ніби парить над фоном. Цей ефект може створювати глибину, виділяти певні елементи та додавати візуального інтересу до веб-сторінки. Для цього ми можемо застосувати властивість box-shadow
.
offset-x
відноситься до горизонтального позиціонування тіні, причому додатне значення зміщує тінь праворуч від елемента, а від'ємне - ліворуч.offset-y
визначає вертикальне розташування тіні: додатне значення зміщує тінь вниз, від'ємне - вгору.blur-radius
задає ступінь розмиття тіні і є необов'язковим значенням, причому чим більше значення, тим більш розмитою буде тінь.spread-radius
також є необов'язковим, збільшує або зменшує розмір тіні залежно від його додатного або від'ємного значення.color
задає колір тіні, використовуючи будь-який допустимий формат кольору, і також є необов'язковим значенням.
index
index
index
Примітка
Щоб знайти найбільш підходящу тінь, відвідайте джерело генератор тіней.
На додаток до box-shadow
, властивості text-shadow
і drop-shadow
дозволяють створювати тіні для тексту та інших елементів відповідно. Вони працюють так само, як і властивість box-shadow
. Однак ці властивості використовуються рідше, ніж box-shadow
.
Дякуємо за ваш відгук!