|
|
|
| Любому веб-мастеру, ввиду своей профессиональной деятельности,
приходится создавать те или иные сложные элементы на сайте (Например: оптекание текстом графики, создание колонок с текстом, фиксация элементов сайта). Однако, стандарт html имеет небольшое количество стандартных элементов оформления страницы, и не все элементы одинаково отображаются в разных браузерах. Каждая компания пытается разработать свой собственный html, порой уходя далеко от основной концепции html, разработанной консорциумом WWW. Поэтому веб-мастеру приходится эксперементировать с элементами, которые являются общими для всех браузеров. Наиболее удачно подходят таблицы т.к в ячейках таблицы удобно размещать информацию. Кроме того, таблицы в html имеют атрибут "border="0" - этот атрибут со значением "0" скрывает границы таблицы т.е остаётся видно содержимое ячейки а сама рамка не видна. Давайте теперь рассмотрим пример разработки табличного дизайна. Цветная граница рамки таблицы. Сразу отмечу, что в html, по умолчанию, встроен атрибут, который отвечает за цвет рамки таблицы. (bordercolor). Однако, нам он не подойдёт, потому что данный атрибут поддерживается только браузером Internet Explorer. В других браузерах этот элемент не работает. Но нам необходимо, чтобы страница одинаково отображалась в любом браузере. К нам на помощь приходят таблицы. Давайте сначала создадим обычную таблицу.
<table width="255" height="72" border="0" align="left" cellpadding="0" cellspacing="2" bgcolor="#000000"> Атрибут "border" должен быть равен "0". cellspacing приравняем к "2" (чем больше число, тем шире получится рамка таблицы). Атрибут "cellspacing" служит для того, чтобы указать расстояние между двумя ячейками. В данном случае, он будет указывать расстояние между двумя таблицами. Зальём таблицу черным цветом, используя атрибут "bgcolor" Вообще вы можете выбрать любой другой цвет, в зависимости от того, какого цвета будет ваша рамка.
<td valign="top"> </td>
С помощью этого тега указывается, откуда следует располагать информацию. В данном примере нам понадобится расположить информацию, начиная с верхнего края таблицы. Вставляем в ячейку нашей таблицы другую таблицу.
<table width="251" height="69" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF"> Указываем цвет фона таблицы. В данном случае, нам понадобится белый фон. Вот и всё. Наша таблица готова. Теперь мы имеем таблицу, рамка которой будет отображаться во всех браузерах одинаково. Напоследок, приведу весь код, который мы создали.
<table width="255" height="72" border="0" align="left" cellpadding="0" cellspacing="2" bgcolor="#000000"> Удачи! |
|
