351 читали · 6 лет назад
Создание сайтов с нуля - урок 35 - Тени в CSS
Тени в CSS создаются при помощи двух свойств: box-shadow и text-shadow. Свойство box-shadow создает тени для блочных элементов, а свойство text-shadow – для текстов. Синтаксис обоих свойств очень похож, поэтому сначала я разберу свойство box-shadow, которое немного сложнее, а затем изучим text-shadow. Свойство box-shadow Полный синтаксис записи свойства box-shadow следующий: box-shadow: inset 1px 2px 3px 4px black; Т.е. в свойстве box-shadow всего 6 параметров, два из которых являются обязательными: это смещение тени по осям x и y. box-shadow: 1px 2px; Первое цифровое значение задает смещение тени по горизонтали, второе - по вертикали...
Текст с тенями
И с градиентом! Как сделать на css обводку текста? ➡️ Итак, один из способов: задать тень (text-shadow), причем тени задаем с каждой стороны text-shadow: 1px 0 1px #000,     0 1px 1px #000,    -1px 0 1px #000,    0 -1px 1px #000; Удобно, если у текста несколько обводок, например: text-shadow:   -2px 0 red,   0 2px violet,   2px 0 red,   0 -2px blue; ❗️Однако, если нужно, чтобы текст при этом был прозрачным, то color: transparent; при наличии text-shadow...