Вернуться на главную MegaWeb.su

CSS3 text-shadow примеры текста с тенью на MegaWeb.su




text-shadow тень текста на css3

Opera 9.5 поддерживает не более шести теней. Позже, это ограничение было снято. Обратите внимание, что опера окрашивает тени в неправильном порядке. Это было исправлено в Opera 10.5. Opera поддерживает максимум 6-9 параметров тени. Повышение этого значения, а также увеличение радиуса размытия свыше 100px сказывается на производительности браузера. Opera версии 9.5-10 использует отображение нескольких теней, как в CSS 2.

Safari до версии 3.2 включительно поддерживает только один параметр тени, остальные игнорируются. В версии 4.0 работает уже множество теней.

Браузер Internet Explorer ни в одной версии не понимает свойство text-shadow. Взамен используется свойство filter: Shadow(параметры). К примеру, следующая конструкция {filter: Shadow(Color=#666666, Direction=45, Strength=4);} задает цвет тени (#666666), её направление (45° от вертикали) и величину смещения (4 пиксела).

Пример 1

text-shadow: -1px -1px #666, 1px 1px #FFF;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 2

text-shadow: 1px 1px 3px #666, -1px -1px 3px #FFF, 1px 1px #666, -1px -1px #FFF;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 3

text-shadow: 0 -1px #000, 1px 0 #000, 0 1px #000, -1px 0 #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 4

text-shadow: 1px 0 #F33, -1px 0 #33F;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 5

text-shadow: 2px 0 4px #600, -2px 0 4px #006;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 6

text-shadow: 0 6px 4px #33F, -3px -5px 4px #F00, 3px -5px 4px #0F0;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 7

text-shadow: 0 0 24px #C00, 0 0 4px #C00, 1px 1px 2px #333;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 8

text-shadow: 1px 1px 2px #999;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 9

text-shadow: 2px 2px 3px #999;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 10

text-shadow: 0 0 8px #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 11

text-shadow: 0 0 11px #0F0;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 12

text-shadow: 0 0 5px #FF0;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 13

text-shadow: 0 0 3px #F90;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 14

text-shadow: 1px 1px 0px #eee, 3px 3px 0px #707070;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 15

text-shadow: 0 0 1px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #ff00de, 0 0 7px #ff00de, 0 0 8px #ff00de, 0 0 10px #ff00de, 0 0 15px #ff00de;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 16

text-shadow: 0px 1px 2px #737373;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 17

text-shadow: 0px 0.5px 1px #F2F2F2;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 18

text-shadow: #f8fcee 0 1px 1px;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 19

text-shadow: 3px 3px 0 rgba(255,0,180,0.5);

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 20

text-shadow: 0 0 4px #fefcc9, 2px -2px 6px #feec85, -4px -4px 8px #ffae34, 4px -8px 10px #ec760c, -4px -12px 12px #cd4606, 0 -16px 14px #973716, 2px -18px 16px #451b0e;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 21

text-shadow: 0 0 4px #ccc, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -18px 18px #f20;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 22

text-shadow: 0px -1px 2px rgb(255, 255, 0), -1px -3px 3px rgb(255, 204, 0), 1px -5px 4px rgb(255, 153, 0), 1px -7px 5px rgb(255, 102, 0), 2px -9px 6px rgb(255, 51, 0), 4px -11px 7px rgb(255, 0, 0);

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 23

text-shadow: 0 0 4px #ccc, 0 -5px 4px #ff3, 2px -10px 6px #fd3, -2px -15px 11px #f80, 2px -18px 18px #f20 0 0 20px #FF0;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 24

text-shadow: 5px 5px 0 #ffd217, 10px 10px 0 #5ac7ff, 15px 15px 0 #ffd217, 20px 20px 0 #5ac7ff;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 25

text-shadow: 0 7px 11px #390;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 26

text-shadow: 0px -15px 0 #F00;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 27

text-shadow: 0 0 11px #FF6;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 28

text-shadow: 0 0 8px #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 29

text-shadow: 2px 2px 3px #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 30

text-shadow: 2px 2px #666;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 31

text-shadow: 2px -2px 3px #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 32

text-shadow: 2px 2px 2px #ff3300;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 33

text-shadow: 0px 1px 1px #fff;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 34

text-shadow: 0px 1px 1px #000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 35

text-shadow: 1px 1px 6px #fff;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 36

text-shadow: 0px 0px 3px#fff;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 37

text-shadow: 1px 1px 4px #fff;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 38

text-shadow: 1px 1px 4px#000;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 39

text-shadow: 0px 25px #600;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.

Пример 40

text-shadow: 0px 1px 0px #ccc;

MegaWeb.su - качественный рабочий материал для создания и оформления web сайтов 2011.




MegaWeb.su - качественный материал для начинающих веб мастеров Valid XHTML 1.0