Библиотека

Используем для этого дела волшебный тэг DIV

<DIV STYLE="width:500; height:300; overflow:scroll; border:double; border-color : #33bd34">Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста. Текст, очень много текста.</DIV>

Как вы правильно понимаете width:500; и height:300; - это размеры окошка, а border:double; и border-color : #33bd34" параметры рамки вокруг окошка.

DIV (HTML 3.2) – Division

Используется для логического выделения блока HTML-документа. Элемент группировки, как и элемент SPAN. В современном сайтостроении используется как удобный контейнер для объектов страницы, которым легко динамически манипулировать – перемещать, включать/выключать, создавать слои, регулировать отступы и т.п.

В браузеронезависимой вёрстке обычно используется для выравнивания блока html-кода в окне браузера.

Находящиеся между начальным и конечным тегами текст или HTML-элементы по умолчанию оформляются как отдельный параграф.

Атрибуты:

ALIGN – определяет выравнивание содержимого элемента DIV. Атрибут может принимать значения: left, right, center.

Тэг DIV в комбинации с CSS можно использовать для создания слоя. Думаю за этой технологией будущее.

Шаблон HTML-кода слоя выглядит так:

<div style="Свойства слоя">
Содержимое слоя
</div>

Свойства слоя - это свойства таблицы стилей CSS. Записываются они так:

свойство: значение

Естественно, свойства слоя могут состоять из нескольких пар свойство: значение, которые отделяются друг от друга точками с запятой.

position: absolute

Без указания этого свойства (именно со значением absolute) вы не сможете установить позицию слоя относительно левого верхнего угла окна броузера с помощью свойств left и top (см. ниже).

left:число

Определяет расстояние от левого края окна броузера до левого края слоя. Допускается указывать эту величину в разных единицах измерения. Можно подстраховаться и принудительно задать в качестве единиц измерения пиксели:

top:число

Определяет расстояние от верхнего края окна броузера до верхнего края слоя. Все остальное - аналогично свойству left.

width:число

Это свойство указывает (сюрприз!) ширину слоя. Если указанная ширина слоя меньше, чем ширина картинок, таблиц и прочих неразрывных элементов, ширина слоя будет определяться наиболее широким элементом. Можно указывать ширину и в процентах (width:100%), правда, это дает несколько странный результат в обоих броузерах.

height:число

Определяет (опять сюрприз!) высоту слоя. Правда некоторые браузеры это свойство не поддерживают - они определяют высоту слоя по его содержимому.

background-color:цвет

Это свойство определяет фоновый цвет слоя. Как и в HTML, можно указывать и шестнадцатеричное значение (#FFFFFF), и "обычное" название цвета (white).

background-image:url(путь)

Определяет фоновое изображение слоя. В качестве пути можно указывать как полный URL (http://www.utugi.ru/img/bgimg.gif) так и относительный путь (/img/bgimg.gif).

z-index:число

Это свойство служит для определения порядка расположения слоев на странице. Чем меньше значение свойства z-index, тем позднее выводится слой на экран. Например, слой со значением z-index, равным 0, будет перекрывать слой с z-index:1. Таким образом, полный пример тега DIV, определяющего слой, может выглядеть следующим образом:

<div style="position:absolute; top:25; left:25; width:200; height:400;
background-color:#FFFFFF; background-image:url(/img/bgimg.gif);"> Содержимое слоя </div>

Между прочим, спецификации CSS предусматривают значительно большее количество различных свойств, которые можно указывать в значении атрибута STYLE. Поэкспериментируйте, и, возможно, вы откроете какие-нибудь новые интересные эффекты DIVных слоев.