Сайт журнала WebDix
Веб-дизайн: Графические форматы Интернета
Колонка редактора Веб-дизайн Раскрутка Заработок Программирование Уроки Photoshop Уроки Flash Журнал Софт Юмор

Menu:


Лучший интернет магазин по лучшей цене!

Индивидуальные уроки по Flash-технологиям в онлайн режиме. 1 занятие - 2 часа. Индивидуальная программа обучения. Написать

Блог журнала
Официальный блог журнала WebDix. Все события из закулисной жизни журнала.
Подробнее

Jinfo.ru
Информационно-развлекательный портал обо всём, что интересно
Подробнее


БЫСТРЫЙ ПЕРЕХОД

Тонкие рамки

Источник : www.izcity.com


Тонкие рамки Сегодня мы научимся правильно создавать рамку вокруг текста. На первый взгляд это кажется очень просто, но многие затрудняются в их создании, и мы попытаемся восстановить пробелы.


Казалось бы, чего уж проще сделать рамку вокруг текста? Создаем таблицу. Вот так:

<TABLE BGCOLOR ="#f0f0f0" WIDTH="100" BORDER="1">
<TR><TD>
<P>Этот абзац заключен в рамку</P>
</TD></TR>
</TABLE>

Но что это? Рамка несколько толстовата! Мы же явно написали, что рамка должна быть толщиной в 1 пиксел! Это связано с тем, что, по умолчанию, расстояние между соседними ячейками в таблице не равно 0. Вот это расстояние и сказывается на ширине рамки.

<TABLE BGCOLOR ="#f0f0f0" CELLSPACING="0" WIDTH="100" BORDER="1">
<TR><TD>
<P>Этот абзац заключен в рамку</P>
</TD></TR>
</TABLE>

Уже гораздо лучше! Но граница, все равно имеет толщину в 2 пикселя. Дело в том, что таблицы отображаются браузерами так, что граница как бы трехмерна и отбрасывает тень. Как от этого избавиться? Поместим нашу таблицу еще в одну таблицу:

<TABLE BGCOLOR="black" CELLSPACING="0" CELLPADDING="1" BORDER="0" WIDTH="100">
<TR><TD>
<TABLE BGCOLOR="#f0f0f0" CELLSPACING="0" BORDER="0" WIDTH="100">
<TR><TD>
<P>Этот абзац заключен в рамку</P>
</TD></TR>
</TABLE>
</TD></TR></TABLE>

Обратите внимание на атрибуты первого тэга <TABLE> BGCOLOR и CELLPADDING. Первый задает цвет границы, а второй - толщину.