Каталог файлов

Рейтинг:5.0
Категория: Скрипты для Ucoz
 


Установка:

CSS

Code
Code
P {  
color:transparent; /* Цвет текста такой же, как и фон */  
text-shadow:0 0 8px #7F7F7F; /* Тень текста. Создаем размытие... */  
text-transform:uppercase; /* Все буквы заглавные */  
font:17pt Verdana; /* Размер и семейство шрфита */  
}


Как видите, мы просто напросто сделали текст таким же, как и фон, за это отвечает значение transparent. После чего добавили свойство text-shadow, тень текста, и не задавая ему параметров сдвига задали лишь радиус размытия. Получился вот такой вот красивый эффект размытия.

Так же, можно еще добавить красивый эффект появления четкости текста, с помощью псевдокласса :hover и transition. Выглядеть будет красиво, да и потом, это делается все очень просто:

CSS

Code
P {  
...  

-webkit-transition:All 1s ease;  
-moz-transition:All 1s ease;  
-o-transition:All 1s ease;  
}  
P:hover {  
text-shadow:0 0 1px #7F7F7F; /* Ставим радиус размытия 1 */  
}


При наведении курсора, радиус размытия плавно изменяется на 1, а от этого размытие будет, но не таким сильным. Можно поступить и по другому, задать свойству text-shadow все параметры по нулям и добавить свойство цвета. Тоже вариант неплохой, но придется писать две строки, когда можно обойтись лишь одной.
 
 
 
 
 0 комментариев  604 просмотров  дата: 29.03.2024  автор: admin
 
 
Советую взглянуть:
  • Адаптация шаблона xBADA от Uc-new
  • Адаптация шаблона Epidem для Ucoz
  • Персональная страница для Ucoz
  • Переключатель страниц( красный)
  •  
     
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    Регистрация | Вход

    Меню сайта

    Мини чат

    Последние комментарии


    Опрос сайта

    Какой дизайн лучше?
    Всего ответов: 9

    Статистика

    Кол-во зареганных: 2908 (+0)
    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    Сейчас на сайте:

    Нас посетили: