Как сделать бегущую строку в ВК

Какие еще теги нужно учесть? Это не так сложно, как может показаться на первый взгляд. Хочу предложить небольшую табличку.

style=»color: #FF0000″
Цвет текста
style=»font-family: Tahoma»
Тип шрифта
direction=»down»
Текст движется вниз
direction=»right»
Текст движется вправо
behavior=»slide»
Текст останавливается при достижении конца
Контролирует время показывания текста
scrollamount=»2″
Скорость движения текста: чем больше значение, тем больше скорость.

ширина текста
bgcolor=»#9999CC»
Изменить тип и размер шрифта в одном тэге.

Например: font-size: 16pt» bgcolor=»#FF0000″ direction=»left» height=»66″ width=»318″>Текст вашей бегущей строки

Текст вашей бегущей строки

ЦВЕТОВАЯ ПАЛИТРА

ПАЛИТРА ЦВЕТОВ — данный вариант позволяет использовать 2 способа задания цвета и КОДОМ в HTML ,и названием цвета в английской транскрипции ,кому как удобно.

КАРТИНКА ЦВЕТА
КОД-RGB
английское название
название ЦВЕТА
Темно-синий
Темно-голубой
mediumblue
Умеренно-голубой
Темно-зеленый
Темный циан
deepskyblue
Темный небесно-синий
darkturquoise

Как сделать бегущую строку на телефоне

Темно-бирюзовый
mediumspringgreen
Умеренный синевато-серый
Известковый
springgreen
Весенний зеленый
midnightblue
Ночной синий
dodgerblue

Тускло-васильковый
lightseagreen
Светлый морской волны
forestgreen
Лесной зеленый
Морской волны
darkslategray
Темный синевато-серый

Зеленовато-известковый
mediumseagreen
Умеренный морской волны
Королевский голубой
Голубовато-стальной
darkslateblue
Темный серовато-синий
mediumturquoise
Умеренно-бирюзовый
darkolivegreen

Темно-оливковый
Блеклый серо-голубой
cornflowerblue
Васильковый
mediumaaquamarine
Умеренно-аквамариновый
Тускло-серый

Серовато-синий
Тускло-коричневый
Синевато-серый
lightslategray
Светлый синевато-серый
mediumslateblue
Умеренный серовато-синий
Зеленой травы
chartreuse
Фисташковый
aquamarine
Оранжево-розовый
Небесно-голубой
lightskyblue
Светлый небесно-синий
blueviolet

Светло-фиолетовый
Темно-красный
darkmagenta
Темный фуксин
saddlebrown
Старой кожи
darkseagreen
Темный морской волны
mediumpurple
Умеренно-пурпурный
darkviolet
Темно-фиолетовый
Бледно-зеленый
darkorchid
Темно-орхидейный
yellowgreen
Желто-зеленый
lightgreen

Светло-зеленый
Коричневый
Темно-серый
Светло-голубой
greenyellow
Желто-зеленый
paleturquise
Бледно-бирюзовый
lightsteelblue
Светло-стальной
powderblue
Туманно-голубой

Огнеупорного кирпича
darkgoldenrod
Темный красно-золотой
mediumorchid
Умеренно-орхидейный
Розово-коричневый
Темный хаки
Серебристый
mediumvioletred
Умеренный красно-фиолетовый

Ярко-красный
Коричневый
Шоколадный
Желтовато-коричневый
Светло-серый
Чертополоха
Орхидейный
Красного золота
plaevioletred
Бледный красно-фиолетовый

Светлый серо-фиолетовый
Старого дерева
Светлый циан
Бледно-лиловый
darksalmon
Темный оранжево-розовый
Фиолетовый
palegoldenrod
Бледно-золотой
lightcoral
Светло-коралловый
Блекло-голубой
Свежего меда
sandybrown

Рыже-коричневый
whitesmoke
Белый дымчатый
Мятно-кремовый
ghostwhite
Туманно-белый
Оранжево-розовый
antuqueWhite
Античный белый
Старого коньяка
Темно-розовый

Бегущая строка на видео 👋🏻

Красно-оранжевый
Ярко-розовый
Коралловый
darkorange
Темно-оранжевый
lightsalmon
Светлый оранжево-розовый
Светло-розовый
Персиковый
navajowhite
Грязно-серый
Бисквитный
Туманно-розовый
blanchedalmond

Светло-кремовый
papayaawhip
lavenderblush
Бледный розово-лиловый
Морской пены
Темно-зеленый
lemonchiffon
floralwhite
Цветочно-белый
lightyellow
Светло-желтый

Слоновой кости

marquee style EN-US» style=»font-family: Georgia, serif;»>font — family : tahoma ; color : # FFFFFF ; font — size : 16 pt » bgcolor font-family: ‘Times New Roman’, serif; font-size: 12pt; line-height: 115%;»>#0000 FF » direction EN-US» style=»font-family: Georgia, serif;»>left » height =»66″ width =»607″>Поздравляю со старым новым годом! marquee >

Еще по теме:  Что такое мессенджер Вконтакте простыми словами

Как вставить Кнопки Социальных сетей.
Здравствуйте, дорогие читатели!

Я хочу с вами поделиться, пожалуй, одной из важных деталей, продвижения своих блогов и открыток в социальных сетях.

Источник: schoolfaberlic.blogspot.com

Бегущая строка для прямых эфиров в OBS

Бегущая строка — полоска текста, которая скользит во время эфира и о чём-то рассказывает! Во время прямых эфиров в SMMplanner мне нравилось зашивать в строку интерактивы для аудитории: какие-то шутки, промокоды, пасхалки. Очевидно, эту штуку замечала небольшая часть аудитории, но по идее это сильно работало на комьюнити.

бегущая строка в эфире Слюсарева во ВКонтакте для SMMplanner

Бегущая строка в OBS

99% всех эфиров я делал в OBS, поэтому настройки для него! Вот небольшая видеозапись настройки!

добавляем текст в источники OBS

Шаг 2. Размещаем текст над чёрным прямоугольником и помещаем бегущую строку в низ экрана. Можно соединить источники в группу и зафиксировать их.

настраиваем отображение текста

Шаг 3. Применяем фильтр «scroll» для бегущей строки. Я в ней настрою горизонтальное движение. Вертикальное движение больше подходит для финальных титров.

окно фильтров в OBS для бегающей строки в OBS выбираем фильтр scroll

Зачем нужна?

95% моих эфиров были обучающие, причём без особой визуальной части, т.е. смотреть на экран — необязательно. Я уверен, что картинку эфира смотрела небольшая часть народу, больше слушали. Поэтому у меня бегущая строка превратилась в инструмент вовлечения для «своих». Зрители самостоятельно догадывались, что полезно смотреть в строку, говорили об этом другим и это, в теории, помогало строить комьюнити.

Промокоды. Запихивал в строку какой-нибудь промокод для новичков на SMMplanner, который работал 1-2 дня. После эфира регистрировал до 5 попыток ввода со 100 зрителей.

Подарки в рассылке. В бегущей строке прописывал, как получить небольшой инфопродукт, вроде шаблонов для Историй или карточек. Для этого нужно было написать какое-то кодовое слово в сообщения группы ВКонтакте. Больше всего зрителей было во ВКонтакте, поэтому рассылку развивали именно там. Регистраций в рассылку было меньше, я думаю это из-за качества инфопродуктов — ну, сколько SMM-специалисту нужно коллекционировать шаблоны?

Шутки. Больше всего нравилось придумывать шутки с различными отсылками. Правда, не похоже что это прям кому-то зашло. За всё время только один раз похвалили шутку про Креосан.

Источник: ilyaslusarev.ru

Бегущая строка в html | Тег

Бегущая строка в html

Бегущая строка– в веб-дизайне является элементом для привлечения внимания, чаще всего используется в рекламных целях. Бегущая строка это текст или картинка, которая движется, слева направо, справа налево или вверх вниз.

Еще по теме:  Как в ВК в кс сделать

В бегущую строку можно вставить новости, объявления, приветствие, скидки, картинку… Отобразить текущее время и дату и другую интересную и нужную информацию.

  1. Как сделать бегущую строку html
  2. Бегущая строка в html с картинками
  3. Как вставить ссылку в бегущую строку
  4. Цветовые обозначения

Как сделать бегущую строку html на сайте

Сделать бегущую строку для сайта не составит большого труда и времени. Что бы заставить текст двигаться без фотошопа был разработан и создан тег html . Сначала только браузер Internet Explorer обрабатывал и поддерживал тег, но затем и все остальные браузеры стали его поддерживать.

Что самое приятное и удивительное это очень маленький и коротенький тег, который приводит в движение не только текст, но и картинки. Чудеса да и только!

Если вам надо, что бы текст двигался справа, можете воспользоваться простеньким кодом:

Тут вставляем текст бегущей строки
Тут вставляем текст бегущей строки

В принципе, бегущую строку можно вставить куда угодно: в футер, сайдбар, под шапкой блога или в саму шапку.

Можно настроить бегущую строку, добавив стили и атрибуты. По умолчанию бегущая строка движется только справа налево, но чтобы изменить направление строки, надо к тегу добавить атрибут direction со значением right :

direction=»right»>Бегущая строка cлева направо
Бегущая строка cлева направо

Что бы текст не исчезал за границы и двигался туда-сюда, нужно добавить атрибут behavior со значением alternate :

behavior=»alternate»>Бегущая строка перемещается между краями
Бегущая строка перемещается между краями

Цветная бегущая строка перемещающаяся между правым и левым краем:

behavior=»alternate» bgcolor=»#e20b0b» direction=»right» style has-inline-color has-vivid-purple-color»>line-height: 150%; text-shadow: #000000 0px 1px 1px;»>Туда-сюда на цветном фоне
Туда-сюда на цветном фоне

Бегущая строка останавливается при наведении:

onmouseout=»this.start()» onmouseover=»this.stop()»> Бегущая строка останавливается при наведении
Бегущая строка останавливается при наведении

Если добавить стили css и украсить нашу бегущую строку, то получится цветная бегущая строка, как на примере:

style has-inline-color has-vivid-purple-color»>line-height: 150%; text-shadow: #000000 0px 1px 1px;»>Цветная бегущая строка
Цветная бегущая строка

Цветная бегущая строка движется слева направо:

direction=»right» style has-inline-color has-vivid-purple-color»>line-height: 150%; text-shadow: #000000 0px 1px 1px;»>Цветная бегущая строка слева направо
Цветная бегущая строка слева направо

Настройки стиля:

color: #ad0dd9 – цвет текста бегущей строки
font-size: 20px – размер шрифта
font-weight: bolder – вес шрифта
text-shadow: #000000 0px 1px 1px; – цвет и размер тени шрифта
bgcolor=“#e20b0b” – цвет фона строки
line-height: 150% – высота строки

Еще по теме:  Как сделать цитирование в ВК

Сделаем бегущую строку на цветном фоне:

bgcolor=»#ffd700″>Бегущая строка на цветном фоне
Бегущая строка на цветном фоне

Чтобы бегущая строка двигалась снизу вверх добавим атрибут direction со значением up :

direction=»up» style has-inline-color has-vivid-purple-color»>line-height: 150%; text-shadow: #000000 0px 1px 1px;»>Бегущая строка снизу вверх
Бегущая строка снизу вверх

И сразу же добавим еще один атрибут heigh и настроим высоту блока:

height=»150″ direction=»up» style=»color:#0F9D58; font-size: 30px; font-weight: bolder; text-shadow: #000000 0px 1px 1px;»>Бегущая строка
Бегущая строка

А теперь заставим бегущую строку двигаться сверху вниз. К атрибуту direction добавим значение down :

height=»150″ direction=»down» style=»color:#1C3850; font-size: 30px; font-weight: bolder; text-shadow: #000000 0px 1px 1px;»>Бегущая строка сверху вниз
Бегущая строка сверху вниз

Что бы регулировать скорость прокрутки бегущей строки добавим атрибут scrolldelay :

scrolldelay=»60″ style has-inline-color has-vivid-purple-color»>line-height: 150%; text-shadow: #000000 0px 1px 1px;»>Бегущая строка
Бегущая строка

Настройка:

scrolldelay=”60″ – изменяем цифры и устанавливаем свою скорость прокрутки

Что бы указать границы блока добавим к стилям рамочку, добавим атрибуты width и height .

height – это высота блока
width – ширина блока
scrollamount – атрибут который влияет на скорость движения, чем выше число тем быстрее движется текст.

direction=»down» height=»150″ width=»300″ scrollamount=»3″ style=»border: 2px solid #000000; text-align: center; color: #f2132d; font-size: 30px; font-weight: bolder; text-shadow: #000000 0px 1px 1px;»>Бегущая строка в рамочке
Бегущая строка в рамочке

Сделаем бегущую строку в рамочке на цветном фоне, добавим атрибут bgcolor :

bgcolor=»#e20b0b» direction=»down» height=»150″ width=»300″ scrollamount=»2″ style=»border: 2px solid #000000; text-align: center; color: #fbfbfc; font-size: 30px; font-weight: bolder; text-shadow: #000000 0px 1px 1px;»>Бегущая строка в рамочке на цветном фоне
Бегущая строка в рамочке на цветном фоне

Бегущая строка в html с картинками

Картинка движется справа налево:

Картинка в бегущей строке слева направо:

direction=»right»>

Картинка сверху вниз (если изменить на direction=”up”, то будет снизу вверх):

height=»150″ direction=»down»>

Снизу вверх и изменяем скорость:

scrollamount=»10″ direction=»up»>

Изображение и текст в бегущей строке:

behavior=»scroll» direction=»left» >Очень рада вас видеть на своем сайте!
Очень рада вас видеть на своем сайте!

Как вставить ссылку в бегущую строку

Так же, вы можете прочитать другие мои статьи

Цветовые обозначения

  • 111 – тег бегущей строки
  • 111 – атрибут отвечающий за направление
  • 111 – еще один атрибут отвечающий за направление
  • 111 – эти части кода отвечают за фон
  • 111 – стиль текста
  • 111 – скорость прокрутки

Источник: neonafm.ru

Рейтинг
( Пока оценок нет )
Загрузка ...