Как использовать тень окна в css?

57
4

Привет, я хочу использовать тень окна для div. Любая идея, как это сделать?

Я использую

box-shadow:         3px 3px 5px 6px #ccc;

но не работает в firefox.

спросил(а) 2013-11-22T13:41:00+04:00 6 лет, 11 месяцев назад
1
Решение
120

Используйте префикс -moz- для более старой версии firefox.

-moz-box-shadow:     3px 3px 5px 6px #ccc; /*will work only in firefox*/
box-shadow: 3px 3px 5px 6px #ccc; /*will work on all browser and latest firefox also*/

Проверьте это здесь.

ответил(а) 2013-11-22T13:42:00+04:00 6 лет, 11 месяцев назад
70

Использование:

-moz-box-shadow:    3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;

следующие документы прекрасно показывают:

1

2

3

ответил(а) 2013-11-22T13:43:00+04:00 6 лет, 11 месяцев назад
41

Просто используйте его: http://css3gen.com/box-shadow/
Это экономит много времени.

ответил(а) 2013-11-22T14:13:00+04:00 6 лет, 11 месяцев назад
42

box-shadow:3px 3px 5px 6px #ccc;
-webkit-box-shadow:3px 3px 5px 6px #ccc;
-moz-box-shadow:3px 3px 5px 6px #ccc;
-o-box-shadow:3px 3px 5px 6px #ccc;
-ms-box-shadow:3px 3px 5px 6px #ccc;

Используйте этот код для вас.

ответил(а) 2013-11-22T13:57:00+04:00 6 лет, 11 месяцев назад
41

для внутренней теневой тени это

 -moz-box-shadow:    inset 0 0 10px #f00;
-webkit-box-shadow: inset 0 0 10px #f00;
box-shadow: inset 0 0 10px #f00;

И для внешней теневой тени используйте это

  -moz-box-shadow:    3px 3px 5px 6px #ccc;
-webkit-box-shadow: 3px 3px 5px 6px #ccc;
box-shadow: 3px 3px 5px 6px #ccc;

ответил(а) 2013-11-22T13:48:00+04:00 6 лет, 11 месяцев назад
41

если вы хотите использовать в mozilla с помощью tag -moz-box-shadow:..
если хром с использованием тега -webkit-box-shadow:..
или в опере, используя тег -o-box-shadow:...
для более подробной информации

http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_image_gallery

ответил(а) 2013-11-22T13:47:00+04:00 6 лет, 11 месяцев назад
42

Попробуй это:

-moz-box-shadow:         3px 3px 5px 6px #ccc;

Проверьте MDN для справки

ответил(а) 2013-11-22T13:43:00+04:00 6 лет, 11 месяцев назад
41

Это выглядит хорошо для меня

    -moz-box-shadow: 3px 3px 3px 3px #cccccc;
box-shadow: 3px 3px 3px 3px #cccccc;

ответил(а) 2013-11-22T13:43:00+04:00 6 лет, 11 месяцев назад
41

https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow

В некоторых версиях Firefox все еще может потребоваться использование префикса -moz. Это может быть проблема?

-moz-box-shadow:         3px 3px 5px 6px #ccc;

ответил(а) 2013-11-22T13:42:00+04:00 6 лет, 11 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема