По идее полагалось бы нарисовать такую рамку и выглядела бы она так:  Затем мы бы разрезали эту рамку на 9 частей и получили бы следующую картинку: 
Как учат умные люди уже проделавшие такой фокус, после разрезания рисунка и обрезания фрагментов мы получили бы 8 изображений: | Рисунок | Положение | Имя файла |
|---|
 | Левый верний угол | 1.gif |  | Верхняя горизонтальная линия | 2.gif |  | Правый верхний угол | 3.gif |  | Левая вертикальная линия | 4.gif |  | Правая вертикальная линия | 6.gif |  | Левый нижний угол | 7.gif |  | Нижняя горизонтальная линия | 8.gif |  | Правый нижний угол | 9.gif |
Вместо 5-го рисунка будет содержимое статьи. Для того, чтобы воспроизвести рамку в броузере построим таблицу 3х3 и по краям поместим рисунки, а в середине текст. Код таблицы будет выглядеть следующим образом: <table width="400" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="13"><img src="1.gif" width="12" height="13"></td>
<td background="2.gif" height="13"><img src="1x1.gif" height=13></td>
<td height="13"><img src="3.gif" width="14" height="13"></td>
</tr>
<tr>
<td background="4.gif" width="12"> </td>
<td align=center>
Содержимое
</td>
<td background="6.gif"> </td>
</tr>
<tr>
<td height="13"><img src="7.gif" width="12" height="13"></td>
<td background="8.gif"><img src="1x1.gif" height="13" width="1"></td>
<td height="13"><img src="9.gif" width="14" height="13"></td>
</tr>
</table> |
В таблице параметры border, cellspacing и cellpadding должны быть равны нулю, иначе линии не будут состыковываться между собой. Уголки вставляем как обычные рисунки с помощью тега IMG, а вот горизонтальные и вертикальные линии следует задавать с помощью фона ячейки таблицы, параметром background. Это позволит сделать нашу рамку масштабируемой и размер ее будет изменяться в зависимости от содержимого. Чтобы линии плотно прилегали друг к другу и между ними не было пробелов надо обязательно указывать все размеры ячеек и рисунков. В ячейках, где фоном размещаются горизонтальные и вертикальные линии, необходимо поместить распорку - это либо пробел, либо прозрачный GIF размером 1 на 1 пиксел (в примере файл называется 1x1.gif). Делается это для того, чтобы обмануть Netscape, который не показывает содержимое ячейки, если в ней ничего нет, фон не в счет. Вот видите какая морока... а хотелось бы что-то попроще... и чтоб не рисовать ничего. Обратите внимание - комментарии в статьях обрамлены как раз такой рамочкой как нам нужно! <table border="0" width="100%" cellspacing="0" cellpadding="0" class="commTable1">
<tr>
<td class="commTopLeft"><img class="topImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
<td width="100%" class="commTopCenter"><img border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
<td class="commTopRight"><img class="topImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
</tr>
<tr>
<td class="commMiddleLeft"><img class="middleImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
<td class="commMiddleCenter">
Сюда то, что должно быть в рамке
</td>
<td class="commMiddleRight"><img class="middleImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
</tr>
<tr>
<td class="commBottomLeft"><img class="bottomImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
<td class="commBottomCenter"><img border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
<td class="commBottomRight"><img class="bottomImg" border="0" src="http://src.ucoz.ru/img/1px.gif" width="1" height="1"></td>
</tr>
</table>
|
То есть мы получили ту же таблицу 3х3, но уже подогнанную под наш дизайн и с рисунками уже сделанными до нас и стоящими на сервере. Осталось только определить, что ставить в серединку. А в серединку ставим следующее: <!-- Body -->
<a href="$HOME_PAGE_LINK$"><img title="Главная страница" border="0" src="http://src.ucoz.ru/t/211/home.gif" align="absmiddle" width="17" height="16"></a>
» <a href="$MAIN_PAGE_LINK$">Каталог статей</a>
» <a href="$CAT_LINK$">$CAT_NAME$</a>
<hr>
<div class="entryTitle1" style="margin-top:8px;">$ENTRY_NAME$</div>
$BODY$
|
Имейте ввиду - http://src.ucoz.ru/t/211/home.gif это значок главной страницы, он имеет цвет согласованный с вашим дизайном. 211 - где 21 - это номер дизайна, 1 - номер поддизайна. В данном случае синий. 213 будет зелёный и так далее.
| 
