Бегущая строка в HTML
Таким же образом в HTML может перемещаться изображение:
В XHTML, как и в HTML 5, бегущая строка запрещена, точнее запрещены теги да и с дизайнерской точки зрения бегущая строка — это вчерашний день. Но! Предположим, что вы все-таки решили разместить у себя на сайте или на отдельной его странице бегущую строчку, тогда используйте для такой страницы структуру документа HTML 4.01.
Автор проекта — Вася Митин | Дата публикации: Октябрь 2009 | Обновление: Ноябрь 2018
HTML код iframe
Бегущая строка в HTML
HTML теги формы
© 2009 — 2023 | При использовании материала, ссылайтесь на мой сайт!
По всем вопросам обращайтесь: go@ab-w.net | Бегущая строка в HTML? – Не вопрос!
Как сделать бегущую строку
Тег создает бегущую строку на странице. На самом деле содержимое контейнера не ограничивается строками и позволяет перемещать (скролировать) любые элементы веб-страницы — изображения, текст, таблицы, элементы форм и т.д. Перемещение можно задать не только по горизонтали, но и вертикали, в этом случае указываются размеры области, в которой будет происходить движение.
Первоначально тег был предназначен только для браузера Internet Explorer, но современные версии других браузеров также понимают и поддерживают этот тег.
Синтаксис
Атрибуты
behavior Задает тип движения содержимого контейнера . bgcolor Цвет фона. direction Указывает направление движения содержимого контейнера . height Высота области прокрутки. hspace Горизонтальные поля вокруг контента. loop Задает, сколько раз будет прокручиваться содержимое. scrollamount Скорость движения контента. scrolldelay Величина задержки в миллисекундах между движениями. truespeed Отменяет встроенный ограничитель скорости при низких значениях атрибута scrolldelay . vspace Вертикальные поля вокруг содержимого. width Ширина области прокрутки.
Закрывающий тег
Валидация
Этот тег не входит в спецификацию HTML и его наличие приведет к невалидному коду.
HTML 4.01 IE Cr Op Sa Fx
Тег MARQUEE
Как сделать бегущую строку? #50905
Перейдите к редактированию той страницы, на которой Вы планируете разместить бегущую строку (список страниц — нажать на страницу — выбрать «Редактирвать содержимое» — «Текст страницы»).

Шаг 4
В текстовом редакторе перейдите к HTML-редактору:

Шаг 5
В открывшемся окне вставьте тег в конце предложения, которое будет являться бегущей строкой.

Обратите внимание!
- Вы можете изменить скорость бегущей строки, для этого используйте атрибут scrollamount ( устанавливает расстояние в пикселах между старым и новым положениями, которые влияют на скорость движения и плавность хода ). Таким образом получится примерно следующее:
Шаг 6
Нажмите «Ок» («Обновить») в HTML-редакторе.

Шаг 7
И сохраните изменения в текстовом редакторе. Бегущая строка готова.

Шаг 8
Перейдите на сайт . На нужной странице должна появиться бегущая строка.

Мы создаём веб-сайты для России и зарубежных рынков с 1997 года. Наша команда – более пятисот сотрудников в разных странах и городах.
Понимание потребностей онлайн-бизнеса, опыт взаимодействия с тысячами клиентов, высокая квалификация персонала, собственные «ноу-хау» и хороший объём заказов позволяют веб-студии Мегагрупп.ру предлагать услуги высокого качества по удивительно низким и «вкусным» ценам.
Этот сайт был создан на платформе
CMS S3 от Megagroup.ru
Данный сайт защищен с помощью reCAPTCHA и соответствует
Политике конфиденциальности и Условиям использования Google.
HTML тег
Тег используется для создания бегущей строки на сайте. При помощи этого тега можно перемещать текст или изображения по горизонтали и вертикали.
Тег
Синтакс
Тег
Пример
html> html> head> title>Заголовок документа title> head> body> marquee> Бегущая строка, созданная при помощи HTML тега Marquee marquee> body> html>
В нашем пример мы не использовали указывающий направление движения атрибут direction для тега , и текст перемещается справа налево по умолчанию.
Пример
html> html> head> title>Заголовок документа title> head> body> marquee direction="down"> Бегущая строка, созданная при помощи HTML тега Marquee. marquee> body> html>
Пример
html> html> head> title>Заголовок документа title> head> body> marquee behavior="scroll" direction="up"> img src="/uploads/media/default/0001/01/0710cad7a1017902166203def268a0df2a5fd545.png" width="190" height="45" alt="W3docs" /> marquee> body> html>
Используйте CSS свойства width и background-color для стилизации элемента .
Пример
html> html> head> title>Заголовок документа title> head> body> style> marquee < width: 100%; padding: 10px 0; background-color: lightblue; > style> marquee direction="scroll">Прокручиваемый текст, созданный с помощью элемента HTML Marquee и стилизованный со свойствами CSS. marquee> body> html>
Атрибуты
| Атрибуты | Значение | Описание |
|---|---|---|
| behavior | slide alternate scroll |
Тип движения slide — останавливается, достигнув края alternate — меняет направление, достигнув края scroll — появляется с противоположной стороны |
| bgcolor | rgb(x,x,x) #xxxxxx colorname |
Цвет фона |
| direction | up down left right |
Направление движения |
| height | pixels % |
Высота области прокрутки |
| hspace | pixels | Горизонтальные поля вокруг тега |
| loop | number | Количество прокруток контента. Если данный атрибут не указан, контент будет прокручиваться постоянно. |
| scrollamount | number | Скорость прокрутки. Размер задается в пикселях. Значение по умолчанию 6. |
| scrolldelay | seconds | Величина задержки в миллисекундах между движениями. Значение по умолчанию — 85. Значения ниже 60 игнорируются. |
| truespeed | seconds | Позволяет использовать значения атрибута scrolldelay равные меньше 60-и миллисекунд. |
| vspace | pixels | Отступ по вертикали. |
| width | pixels % |
Ширина области прокрутки. |
Как добавить стиль к тегу ?
Распространенные свойства для изменения визуальной насыщенности/выделения/размера текста внутри тега :
- CSS свойство font-style задает стиль шрифта: normal | italic | oblique | initial | inherit
- CSS свойство font-family создает приоритетный список названий семейства шрифтов и/или общее имя шрифтов для выбранных элементов.
- CSS свойство font-size задает размер щрифта.
- CSS свойство font-weight устанавливает насыщенность шрифта.
- CSS свойство text-transform задает регистр текста (заглавные или строчные буквы).
- CSS свойство text-decoration устанавливает оформление текста. Оно является сокращенным свойством для text-decoration-line, text-decoration-color, text-decoration-style.
Цвет текста внутри тега :
- CSS свойство color определяет цвет контента и оформления текста.
- CSS свойство background-color устанавливает фоновый цвет элемента.
Стили форматирования текста для тега :
- CSS свойство text-indent указывает размер отступа первой строки в текстовом блоке.
- CSS свойство text-overflow указывает, как будет отображаться пользователю строчный текст, выходящий за границы блока.
- CSS свойство white-space указывает, как будут отображены пробелы внутри элемента.
- CSS свойство word-break указывает перенос строки.
Другие свойства для тега :
- CSS свойство text-shadow добавляет тень к тексту.
- CSS свойство text-align-last выравнивает последнюю строку текста.
- CSS свойство line-height устанавливает межстрочный интервал.
- CSS свойство letter-spacing устанавливает расстояние между буквами/символами в тексте.
- CSS свойство word-spacing устанавливает расстояние между словами в тексте.