30.10.2012

Урок 3. Горизонтальные линии и бегущая строка

Для того, чтобы текст на веб-страничке был как можно более наглядным и удобочитаемым можно применять различные приемы. Среди них и разделение частей текста горизонтальными линиями, и создание, так называемой, "бегущей строки". Об этом и поговорим на сегодняшнем уроке.

 

Горизонтальные линии

Различные части большого документа можно визуально отделить одну от другой с помощью горизонтальных линий.
Горизонтальные линии рисуются с помощью непарного тега <HR />
Тег имеет несколько атрибутов: 
size – толщина линии в пикселях,   
width - длина линии в процентах или пикселях, 
noshade -  делает линии "плоскими”, 
color – задает цвет линии.
 
А вот и несколько примеров:
Просто горизонтальная линия.
Тег <HR />

Горизонтальная линия зеленого цвета шириной в пол-экрана и толщиной в 10 пикселей.
Тег <HR color="green" width="50%" size="10px">


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

Можно заставить текст двигаться по экрану влево или вправо с помощью парного тега <MARQUEE> текст </MARQUEE>. 
Тег имеет атрибуты: 
width – ширина поля бегущей строки (в пикселах или процентах от ширины окна);
height - высота поля бегущей строки (в пикселах);
direction – определяет направление движения строки. 
  Может принимать следующие значения: left, right;
behavior – определяет способ движения строки.
  Может принимать значения: 
 scroll – текст появляется от одного края и скрывается за другим;
 slide – текст вытягивается с одного края и останавливается у другого;
 alternate – попеременное движение от одного края к другому и обратно.
 bgcolor – цвет поля бегущей строки.

Вот тоже несколько примеров применения данного тега:

Строка текста, бегущая справа-налево.

Тег <MARQUEE>Вот бегущий текст</MARQUEE>

Вот бегущий текст

Строка текста, бегущая слева-направо по розовому фону.

Тег <MARQUEE direction="right" bgcolor="pink">Вот бегущий текст</MARQUEE>

Вот бегущий текст  

 

Вот пока и все. Следующий раз поговорим о создании списков.

До встречи!