Свойство box-shadow css, эффективный способ создания эффекта тени?

Question

Я исследовал технику эффекта падающей тени для веб-дизайна.Итак, я хотел бы применить эту технику, чтобы использовать реализацию верхней панели заголовка для моего сайта.

Из моих выводов наиболее часто используемое людьми является свойство box-shadow css.Я хотел бы знать, является ли это наиболее эффективным, но простым способом достижения желаемого результата или нет.какие-либо другие варианты, доступные для меня, чтобы реализовать то же самое, а также их плюсы и минусы?

любой совет будет очень ценится?

Answer 1

Самый простой способ это Photoshop:)

В противном случае читайте дальше: http://www.css3.info/preview/box-shadow/

box-shadow - это свойство CSS3, означающее, что оно недоступно в

Пример кода CSS для тени IE:

filter:progid:DXImageTransform.Microsoft.Shadow(color='#000000',direction='120',strength='20');

CSS3 версия:

element {
    -moz-box-shadow: 10px 10px 5px #888;
    -webkit-box-shadow: 10px 10px 5px #888;
    -o-box-shadow: 10px 10px 5px #888;
    -khtml-box-shadow: 10px 10px 5px #888;
    box-shadow: 10px 10px 5px #888;
}

Answer 2

Единственным другим параметром свойства box-shadow в CSS3 является использование изображений. Тени CSS3 легче применять и требуют меньшего веса страницы (кб) для использования. Однако не все браузеры будут поддерживать CSS3 box-shadows.

При использовании свойства box-shadow обязательно установите все различные свойства для разных браузеров.

box-shadow: 1px 2px 3px #000;
-moz-box-shadow: 1px 2px 3px #000;
-webkit-box-shadow: 1px 2px 3px #000;
-o-box-shadow: 1px 2px 3px #000;
-khtml-box-shadow: 1px 2px 3px #000;