
Примерный вариант посмотрите выше. Использовать будем совсем стандартные стили, чтобы можно поиграться и создать любую надпись на любой вкус. Я всё пометила в самом коде. Для эффекта тени применим свойство text-shadow:, но это уже на Ваше усмотрение. В статье ваша анимированная подпись тоже был предложен интересный вариант, но всё же мы имели на входе картинку, что чуть - чуть, но влияет на загрузку в целом.
Этот код намного легче.
<style type="text/css">
.hbz-signature {
text-align: right; /* - расположение подписи- */
font-size: 18px; /* - размер шрифта- */
font-family: Papyrus,fantasy; /* - стили текста - */
text-shadow: 1px 1px #732372, 1px -1px #732372, -1px 1px #732372, -1px -1px #732372, 3px 3px 6px rgba(0,0,0,.5); /* - цвет и размеры тени - */
margin-top : 30px; /* - отступ - */
color: rgb(49, 151, 116); /* - основной цвет текста - */
}
.hbz-signature span {
font-size: 14px;
vertical-align: top;
}
</style>
<div class="hbz-signature">
Ваше имя</div>
.hbz-signature {
text-align: right; /* - расположение подписи- */
font-size: 18px; /* - размер шрифта- */
font-family: Papyrus,fantasy; /* - стили текста - */
text-shadow: 1px 1px #732372, 1px -1px #732372, -1px 1px #732372, -1px -1px #732372, 3px 3px 6px rgba(0,0,0,.5); /* - цвет и размеры тени - */
margin-top : 30px; /* - отступ - */
color: rgb(49, 151, 116); /* - основной цвет текста - */
}
.hbz-signature span {
font-size: 14px;
vertical-align: top;
}
</style>
<div class="hbz-signature">
Ваше имя</div>
Все настройки простые. Меняя отмеченные стили, есть возможность создать что - то совсем уникальное. Код устанавливаем в редакторе сообщения в режиме HTML. Чтобы постоянно не прописывать такой код в сообщении в Блоггере есть возможность установить его используя опцию шаблон сообщения в разделе настройки.
Вот и всё на сегодня. Всем добра и до встречи.
👇
Получайте новые сообщения с блога прямо на почту
Очень полезно! Спасибо большое)))
ОтветитьУдалитьКрасивая подпись всегда привлекает внимание.
Удалить