вопрос | ответ |
Тень также можно добавлять и к псевдоэлементам, это иногда требуется для сложной вёрстки. На рис. 3 показан блок с заголовком, к которому добавлена те | ::after и добавлять тень к нему. |
Цвет тени можно указывать в любом доступном формате, так, для получения полупрозрачной тени подойдёт формат RGBA, такая тень будет хорошо смотреться н | box-shadow: 0.4em 0.4em 5px rgba(122,122,122,0.5); |
Для добавления тени используется свойство box-shadow, у которого имеется шесть значений, из них только два являются обязательными. | Следует указать только сдвиг по горизонтали и вертикали, все остальные параметры будут приниматься по умолчанию. В этом случае тень будет резкой без р |
box-shadow: inset 5px 5px 10px 3px #ccc; | 1) ключевое слово inset устанавливает тень внутри элемента; 2) сдвиг тени по горизонтали (5px — вправо, -5px — влево); 3) сдвиг по вертикал |
Можно задать несколько параметров, разделённых запятой. | box-shadow: 0 0 20px black, 20px 15px 30px yellow, -20px 15px 30px lime, -20px -15px 30px blue, 20px -15px 30px |
Можно задать несколько параметров, разделённых запятой. | box-shadow: 5px 5px 5px #40310a, -5px -5px 5px #40310a; |
Тень внутри блока | box-shadow: 0px 0px 20px #40310a inset; |
Объединение | box-shadow: 2px 5px 5px 3px #40310a; |
Ширина 10px | box-shadow: 0 0 0 10px #40310a; |
Ширина 5px | box-shadow: 0 0 0 5px #40310a; |
Ширина 1px | box-shadow: 0 0 0 1px #40310a; |
Размытие 50px | box-shadow: 0 0 50px #40310a; |
Размытие 20px | box-shadow: 0 0 20px #40310a; |
Размытие 5px | box-shadow: 0 0 5px #40310a; |
Смещение влево и вверх | box-shadow: -15px -10px #40310a; |
Смещение вправо и вверх | box-shadow: 15px -10px #40310a; |
Смещение вправо и вниз | box-shadow: 15px 10px #40310a; |
В Опере и Firefox | box-shadow: 5px 5px 5px #ABC; |
Internet Explorer | -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(color=#AABBCC,direction=125,strength=5)"; |
Google Crome и Safari | -webkit-box-shadow: 5px 5px 5px #ABC; |
для других прямоугольников - Здесь браузеры воспринимают каждый свой синтаксис: | box-shadow |