Page 88 - Сила CSS3 Освой новейший стандарт

88 • Глава 2. Облачка с текстом

Отрицательные значения top и left отвечают за смещение облачка с текстом и соз-
дание впечатления подвижного элемента; эффект усиливается за счет увеличения
размера тени с 1 пиксела до 3 пикселов (рис. 2.22). Именно благодаря увеличению
тени зрителю начинает казаться, что облачко приподнимается над фоном, а не про-
сто сдвигается вверх на странице.

Рис. 2.22. Более крупная тень визуально «приподнимает» облачко над фоном

коротко о СвойСтве box-Shadow
Свойство box-shadow входит в черновой модуль Backgrounds and Borders (Фон и границы),
который вы можете найти по адресу http://dev.w3.org/csswg/css3-background/#the-box-
shadow; в конечном итоге завершенный модуль будет размещен по адресу http://www.
w3.org/TR/css3-background.

В этом свойстве вы указываете смещение тени относительно поля по горизонтали и по
вертикали, а также цвет тени. Также чаще всего рекомендуется задавать радиус размытия
(по умолчанию он равен нулю) и, при желании, радиус распространения, положительные
значения которого расширяют тень, а отрицательные — сжимают. Можно сделать так,
чтобы тень отображалась внутри поля, а не снаружи: для этого добавьте ключевое слово
inset в начале или в конце значения box-shadow. (Радиус распространения и ключевое
слово inset не поддерживаются в Safari 4 и более ранних версиях, в Safari для iOS 3 и более
ранних версиях и в IE 9.)
С одним полем может быть связано несколько теней; просто перечислите значения внутри
одного и того же свойства box-shadow, разделив их запятыми. Тени будут накладываться
одна на другую, и объявленная первой окажется наверху.

www.trk.kg