Приветствую Вас Гость • Регистрация • Вход
Суббота, 19.10.2019
Главная » 2012 » Декабрь » 22 » Делаем наши банеры полупрозрачными
09:54
Делаем наши банеры полупрозрачными
Здравствуйте уважаемые читатели!
Что то меня пробило на дизайнерские мысли и действия, так что как Вы уже поняли тема нашего сегодняшнего разговора будет опять связана с вопросами CSS.Как всем Вам известно то, что ни один сайт не обходится  без рекламного баннера, или же баннера статистики вашего сайта, и этим сейчас никого не удивишь.Но порой пользователям такие вот рекламные баннеры начинают резать глаза, особенно если их количество от 3...Поэтому тема нашей коротенькой  статьи сегодня будет посвящена тому, как эти наши баннеры зделать не такими режущими глаз (а именно полупрозрачными).И будем мы все это делать с помощью таблицы нашего стиля CSS.И так давайте же узнаем как все это сделать...
Первое что нам нужно зделать,так это открыть нашу таблицу стилей   CSS (найти её можно в Вашей теме оформления) и открыть в любом текстовом редакторе.Далее нам нужно будет вставить в любое место вашего стиля   CSS вот это значение div-а:
Код
#banners a img {
opacity:0.3;
-moz-opacity:0.3;
filter:alpha(opacity=40);
}
#banners a:hover img {
opacity:1.0;
-moz-opacity:1.0;
filter:alpha(opacity=100);
После того как мы добавили наше значение   div-а мы можем смело теперь заключать код нашего баннера в это значение таким вот простым класом:
Код
<div id="banners">Код баннера или адрес картинки</div>
Ну и естественно наведу пример того, что у нас должно получится.


Исходное


Что вышло

Я в контактеЯ в моем миреЯ в Facebook 


Я в контактеЯ в FacebookЯ в моем мире
Прозрачность всегда можна поменять с заменой значения 0.3 на желаемое.
Ну вот и все,удачных кликов и переходов!До новых встреч!
Категория: CSS | Просмотров: 1393 | Добавил: Samosval |Рейтинг: 0.0/0


Всего комментариев: 0
avatar
    Яндекс.Метрика
Сайт создан в системе uCozЯндекс.Метрика