Приглашаем посетить
Автомобили (auto-2000.niv.ru)

HTML

Создание одинарной рамки

Самый простой способ создания рамки заключается в использовании свойств таблицы, точнее параметра border. Рамки созданные таким образом незначительно отличаются по своему виду в Internet Explorer (Рис. 1) и Netscape Navigator (Рис. 2).

HTML
Рис. 1. Рамка в Internet Explorer
HTML
Рис. 2. Рамка в Netscape Navigator

Пример 1. Рамка, созданная параметром border таблицы
<table border="2" width="100" height="100" bordercolor="#ff0000" cellpadding="6" cellspacing="0" bgcolor="#e0e0e0">
<tr>
<td>&nbsp;</td>
</tr>
</table>

Параметр border определяет толщину рамки, bordercolor - ее цвет, cellpadding задает расстояние от рамки до содержимого таблицы.

Один из универсальных и распространенных способов создания рамки. Создаем таблицу (рис. 3) и заливаем крайние ячейки нужным цветом (рис. 4). Толщина рамки в этом случае определяется толщиной ячейки. Обязательно следует поместить в эти ячейки таблицы распорку - прозрачный рисунок размером 1 на 1 пиксел, иначе в Netscape этот способ работать не будет.
HTML
Рис. 3
HTML
Рис. 4

Пример 2. Создание рамки заливкой цветом ячеек таблицы
<table width="200" border="0" height="200" cellspacing="0" cellpadding="0">
<tr bgcolor="#FF6633">
<td width="2" height="2"><img src="1x1.gif" width="2" height="2"></td>
<td height="2"><img src="1x1.gif" width="2" height="2"></td>
<td width="2" height="2"><img src="1x1.gif" width="2" height="2"></td>
</tr>
<tr>
<td width="2" bgcolor="#FF6633"><img src="1x1.gif" width="2" height="2"></td>
<td align=center>Содержимое</td>
<td width="2" bgcolor="#FF6633"><img src="1x1.gif" width="2" height="2"></td>
</tr>
<tr bgcolor="#FF6633">
<td width="2" height="2"><img src="1x1.gif" width="2" height="2"></td>
<td height="2"><img src="1x1.gif" width="2" height="2"></td>
<td width="2" height="2"><img src="1x1.gif" width="2" height="2"></td>
</tr>
</table>

В данном примере делается красная рамка толщиной 2 пиксела, она смотрится наиболее элегантно. Параметры таблицы cellspacing и cellpadding приравниваются нулю, чтобы рамка оставалась нужной толщины и без зазоров.

Вернуться к оглавлению