Цитата сообщения tomishka И снова о простых рамочках

Приведу скелетик еще одной простой рамочки для текста и дам некоторые пояснения.

<center><table style="background-image:url('АДРЕС ОКАЙМЛЯЮЩЕГО ФОНА'); background-color: #;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url('АДРЕС ФОНА ПОД ТЕКСТ'); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #000000;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#664400" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>


Ширина рамки 700 px ( width="700" ), при желании можно взять больше или чуть меньше, например, width="750"
Цвет текста коричневый ( #664400 ), можно взять черный ( #000000 ) или белый ( #ffffff ).
Обе тени ( внешняя и внутренняя ) черные #000000, но их можно брать, ориентируясь на цвет выбранных двух фонов.
Самый простой вариант рамочки, выполненный по данному скелетику, приведен ниже, а получим мы его, если аккуратно уберем оба адреса для фонов из приведенного скелетика.

Здесь будет ваш текст

<center><table style="background-image:url(''); background-color: #;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url(''); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #000000;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#664400" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>

Дважды в скелетике используется background-color: #, но цвет не указан. Проведем эксперимент, взяв красный цвет fc0202, а поставим его только в первом случае, удалив адреса двух фонов. Рамочка будет такой:

Здесь будет ваш текст

<center><table style="background-image:url(''); background-color: #fc0202;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url(''); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #000000;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#ffffff" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>

Значит, меняя шестизначный шестнадцатеричный код, мы можем получить рамочку любого оттенка, например:

Здесь будет ваш текст

<center><table style="background-image:url(''); background-color: #0095B6;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url(''); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #000000;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#ffffff" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>
Если тот же код мы поставим в приведенном скелетике во втором случае, то вид рамочки будет такой:

Здесь будет ваш текст

<center><table style="background-image:url(''); background-color: #;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url(''); background-color: #0095B6; border-radius: 8px; box-shadow: 4px 4px 20px #000000;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#ffffff" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>

Мы с вами рассмотрели варианты однотонных рамочек, но мы можем взять бесшовные красивые фоны и получить более интересные рамочки. Вот для примера две рамочки с кодами, по которым будет все понятно.

Здесь будет ваш текст

<center><table style="background-image:url('https://img0.liveinternet.ru/images/attach/d/3/156/99/156099400_f4.jpg'); background-color: #;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url(''); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #666666;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#000000" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>

Здесь будет ваш текст

<center><table style="background-image:url('//img1.liveinternet.ru/images/attach/d/3/157/9/157009981_g0.jpg'); background-color: #;box-shadow:-4px 4px 20px #000000; border-radius: 8px; box-shadow: 3px 3px 20px #000000;" 7px="7px" cellspacing="0" cellpadding="0" width="700"><tr><td style="padding:20px" zzz="zzz" align="center"><table style="background-image: url('https://img0.liveinternet.ru/images/attach/d/3/156/99/156099400_f4.jpg'); background-color: #; border-radius: 8px; box-shadow: 4px 4px 20px #666666;box-shadow:-4px 4px 20px #000000;cellspacing=" cellpadding="0" width="700"><tr><td style="padding:10px" zzz="zzz" align="center"><center><font size="5" color="#000000" face="Monotype Corsiva"><br />Здесь будет ваш текст<br /><br /></font></center></td></tr></table></td></tr></table></center>
Всем удачи!!!