Як створити прокрутку у вигляді біжучого рядка в HTML
Чи бачили ви коли-небудь круте переміщення прокручується тексту на веб-сайті? А чи замислювалися, як воно зроблено? Вам не треба більше шукати десь інформацію! Ця прокрутка тексту називається "біжучим рядком" (marquee). Вона може бути виконана в будь-якому кольорі, її можна прокручувати в будь-якому напрямку і багато іншого. Дивіться Крок 1 нижче, щоб почати!
Кроки
1
Відкрийте HTML-документ, якщо ще цього не зробили.
2
Додайте даний код там, де хочете, щоб біжучий рядок (Marquee) перебувала:
3
Виберіть колір фону. Можна змінити фон біжучого рядка, вказавши шістнадцяткове значення (HEX) або RGB-значення (червоний-зелений-синій) після частини коду "background-color:" (колір фону). Значення за замовчуванням, вказане вище, # 000080 - це [b]темно-синій колір. Повний список кольорів та їх значення можна знайти тут.
4
Встановіть напрямок прокрутки. Змініть атрибут direction в коді на будь-який з наступних: right (зліва направо), left (справа наліво (за замовчуванням)), up (знизу вгору) або down (зверху вниз).
5
Вкажіть кількість циклів руху рухомого рядка. Атрибут loop можна змінити відповідно до потреб - він контролює, скільки разів біжучий рядок повинна переміщатися. Якщо хочете, щоб вона рухалася безперервно, то опустіть його.
6
Вкажіть текст біжучого рядка. Текст всередині тега і тег будуть текстом прокрутки рядка, що біжить. Напишіть те, що хочете, щоб вона відображала.
7
Встановіть колір тексту. Додавання атрибута style всередину наборутегів, оточуючих ваш текст, може дозволити контролювати колір тексту в біжучому рядку. Вам потрібно, щоб цей колір відрізнявся від фону: текст має бути видно. Наприклад, текст, який має інший відтінок синього, ніж фон, потрібно включити в такі теги:
Поради
- Ось простий код прокрутки рядка, що біжить:
Це прокрутка рухомого рядка
- Рухомі рядки на сайтах, як правило, трохи дратують.
- Будьте обережні, коли змінюєте атрибути рядка, що біжить.
Попередження
- Елемент - це [b]deprecated, що означає, що він є неправильним тегом HTML і не повинен використовуватися. Сторінки не будуть перевірятися валідаторами, якщо вони включають в себе такий тег. І це може викликати проблеми з деякими браузерами.
- Велика кількість анімації може відволікати! Це також виглядає непрофесійно і змушує відвідувача чекати появи контенту (тобто, відвідувач піде, і ви втратите продажу). Сайти, що використовують рухомі рядки, організовують їх у списки, як наприклад "Web Pages that Suck" ("Відстійні" веб-сторінки).
