AAA Главная
Примеры PHP Примеры JavaScript Примеры Ajax Примеры CSS,HTML

Эффект свечения с CSS3

Как создать эффект свечения с CSS3?

Здесь приводится простой способ добавления эффекта свечения на контент с помощью такого свойства ccs3, как «бросить тень».

Свечение для DIV-элементов

Тень для элементов DIV

код:

<div style="width:500px;height:50px;line-height:50px;margin:30px auto;padding:0 20px;background:#222;color:#fff;text-align:center;border:1px solid #fff;-moz-box-shadow:0 0 20px #555; -webkit-box-shadow:0 0 20px #555;box-shadow:0 0 20px #555;" />
Тень для элементов DIV
</div>

Код для .css-файла:

-moz-box-shadow:0 0 20px #555;
-webkit-box-shadow:0 0 20px #555;
box-shadow:0 0 20px #555;

Свечение для изображений

Использование встроенных стилей:

<img src="kdg.htmlweb.ru/kdgpic/foto.jpg"
	alt="kdg"
	style="margin:30px;border:1px solid #fff;-moz-box-shadow:0 0 20px #555; -webkit-box-shadow:0 0 20px #555;box-shadow:0 0 20px #555;" />
kdg

Чистый css:

-moz-box-shadow:0 0 20px #555;
-webkit-box-shadow:0 0 20px #555;
box-shadow:0 0 20px #555;

Создание эффекта неонового свечения для вашего текста, используя свойство text-shadow:

<p style="font:bold 3.0em Myriad Pro,myriad,arial,sans-serif;line-height:50px;color:#ff0000;text-shadow:0 0 20px #ff0000;display:block;">Текст со свечением!</p>

Текст со свечением!

Используя только css:

color:#ff0;
text-shadow:0 0 20px #ff0;

.

© Copyright 2008-2016 by KDG