Делаем рамки

http://www.liveinternet.ru/users/3193732/post105598679/ Для начала нужно найти рисунок будущей рамки.

Для того что бы не приходилось менять размер рамки в зависимости от того что мы в ней разместим ( фотку или текст ), разобьем рисунок рамки на 8 одинаковых по размеру частей.


В результате получим 8 маленьких рисунков.

Верхний левый угол ; Верхняя часть рамки ; Верхний правый угол ;
Левая часть рамки ; Правая часть рамки ;
Нижний левый угол ; Нижняя часть рамки ; Нижний правый угол

Теперь нужно сделать таблицу 3х3

<table style="text-align: left; " border="0" cellpadding="0" cellspacing="0"> <tbody> <tr> <td style="vertical-align: top; height: 27px; width: 27px; background: url('1') no-repeat;"></td> <td style="vertical-align: top; height: 27px; background: url( '2') repeat-x;"></td> <td style="vertical-align: top; height: 27px; width: 27px; background: url( '3') no-repeat;"></td> </tr> <tr> <td style="vertical-align: top; width: 27px; background: url( '4') repeat-y;"></td> <td style="vertical-align: top; background-color: #fff7d0;"> Здесь расмещается ваш текст или картинка </td> <td style="vertical-align: top; width: 27px; background: url( '5') repeat-y;"></td> </tr> <tr> <td style="vertical-align: top; height: 27px; width: 27px; background: url( '6') no-repeat;"></td> <td style="vertical-align: top; height: 27px; background: url( '7') repeat-x;"></td> <td style="vertical-align: top; height: 27px; width: 27px; background: url( '8') no-repeat;"></td> </tr> </tbody> </table>
Что бы не загромождать код я вместо кода картинок в стиле background прописал цифры 1,2,3,4,5,6,7,8.
Когда вы зальете в дневник все 8 частей рамки вам останется вместо цифр подставить коды рисунков.
В моем случаее вместо 1 нужно прописать //img0.liveinternet.ru/images/attach/c/1//45/676/45676186_ul.gif
( код рисунков виден при редактировании сообщения в простом редакторе)
Размеры ячеек таблицы width - ширина, height - высота должны соответствовать размерам рисунков частей рамки.
Из-за того что лиру думает за нас :), возможно прийдется подбирать размеры ячеек что бы не было разрывов рамки.
Для таблицы обязательно должно быть прописано border="0" cellpadding="0" cellspacing="0"!

И вот что получилось :)

	Ваш текст или фотка или текст и фотка :)))

И напоследок ....сделать код в дневнике "повеселее" можно вот так

<textarea cols="80" rows="5" style="background-color: #fff7d0; border: solid 1px #0000f0; overflow: hidden;">
cols = ширина блока
rows - высота блока
background-color - цвет фона ( можно добавить color: #000000; - цвет текста )
border - вид рамки ( solid ), ширина рамки ( 1px ) и цвет рамки ( #0000f0 )
overflow - скрывать все что не помещается в блок