Эффектное оформление ссылок в блоге



Оформление ссылок в блоге

Доброго времени суток всем! Давайте приукрасим наши ссылки в блоге. Особых знаний не понадобится, нужно всего лишь вставить код в дизайн-добавить гаджет-Html/JavaScript.

Хочу сразу предупредить, что не во всех шаблонах уживается этот код. В этом блоге после вставки кода у меня поплыли миниатюры перелинковки страниц, сместилось меню и социальные кнопки. Так что к сожалению, пришлось отказаться и удалить. Зато в другом блоге код прижился.

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

Всплывающее оформление ссылок в блоге. Скрипт для оформления.


 Для тех, кого заинтересовало, копируйте код и вставляете, как я писала в начале поста.

<style>a {display: inline-block;          padding: 2px;          outline: 0;           border: 1px solid transparent; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px; border-radius: 5px; -webkit-transition: box-shadow 0.7s ease, background 0.7s ease, border 0.7s ease; -moz-transition: box-shadow 0.7s ease, background 0.7s ease, border 0.7s ease; -o-transition: box-shadow 0.7s ease, background 0.7s ease, border 0.7s ease; transition: box-shadow 0.7s ease, background 0.7s ease, border 0.7s ease; }  a:hover {           background: #e8e8e8; border: 1px solid #999999; text-decoration: none; text-shadow: none; -moz-box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); -webkid-box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); box-shadow: 1em 1em 1em -0.5em rgba(0,0,6,0.5); }}</style>




Автор статьи ✎ Olga Protasova Выпуск ✹ 10/06/2013 Ярлыки ►


Открыть комментарии →

2 коммент. :

  1. Доброго времени суток Ольга! Подскажите пожалуйста на сайте tesing777777.blogspot.ru в правом сайтбаре установила баннеры goo.gl/nmy2pz, у каждого изображения есть ссылка, но когда кликаешь по изображению переход по ссылке не происходит? Как можно это исправить? С уважением Тата

    ОтветитьУдалить
    Ответы
    1. Tata, здравствуйте. Скиньте мне на почту html код гаджета. Адрес у Вас есть.

      Удалить

Ув. читатели! Для вставки HTML кода в комментарии, воспользуйтесь в меню Генератором преобразования HTML кода.

 
Технологии Blogger.

Форма для связи

Имя

Электронная почта *

Сообщение *