Как мне сделать фон чтобы от сверха к низу он из черного постепенно переходил в голубой

Есть несколько способов...
Самый постой - делаешь градиент в фотошопе (или любоом другом продвинутом растовом редакторе)... Делаешь полоску вертикальную ширинной в 1 пиксель, и задаешь её фоном...
Проблема в том, что высота в таком случае - ограничена...
Другой способ - это флэш... Прекрасно растягивается под любые размеры окна..., но не всегда открывается браузерами (если не предустановлен соотвествующий плагин)..
Ява-скрипт... Был такой... но не помню и не советую использовать... Во-первых, прдётся адаптировать под несколько разновидностей браузеров.. Во-вторых, использование скриптовых спецэффектов - является дурным тоном в вэб-дизайне...

примерно так должно выглядеть...

Код

<div id="Layer1" style="position:absolute;   width:100%; height:500px; z-index:1; background-image: url(gradient%20black-blue.jpg);  "></div>

А вот и сам градиент...


Присоединённый файл ( Кол-во скачиваний: 13 )
 gradient_black_blue.jpg 0,98 Kb

thanx
а почему ты изпользуешь ДИВ?

По тому что это слой

и куда вставить этот тег в ячейку таблицы?

С Дивами можно и без таблиц обходиться... Их можно подвешивать куда угодно, а в них уже размещать ячейки таблиц...

Кстате чем хороши слои ими ты можеш формировать загруску страницы

Phantom1 можно поподробнее о слоях и загрузке

Наверника при медленном дайлапе ты видил как страница грузица по честям(если все правельно зделано) так вот при помощи слоев можно делать что покажется первым а что и в конце.

Пример 1
Загруска проходит последовательно ->Layer1->Layer2->Layer3->Layer4->{text}

Код

<body> <div id="Layer1" style="position:absolute; left:20px; top:14px; width:395px; height:36px; z-index:1; background-color: #00FF00; layer-background-color: #00FF00; border: 1px none #000000;"></div> <div id="Layer2" style="position:absolute; left:18px; top:52px; width:395px; height:36px; z-index:1; background-color: #0000FF; layer-background-color: #0000FF; border: 1px none #000000;"></div> <div id="Layer3" style="position:absolute; left:19px; top:90px; width:395px; height:36px; z-index:1; background-color: #FFFF00; layer-background-color: #FFFF00; border: 1px none #000000;"></div> <div id="Layer4" style="position:absolute; left:19px; top:128px; width:395px; height:36px; z-index:1; background-color: #00FFFF; layer-background-color: #00FFFF; border: 1px none #000000;"></div> лалалалалалалала лалала лалалал алалал алала алалал алалал алалал алал ала лал лал лал ла ла ла лал лала л лал ла лал  </body>

Пример 2
Загруска проходит последовательно ->Layer4->Layer2->Layer3->{text}->Layer1

Код

<body> <div id="Layer2" style="position:absolute; left:18px; top:52px; width:395px; height:36px; z-index:1; background-color: #0000FF; layer-background-color: #0000FF; border: 1px none #000000;"></div> <div id="Layer3" style="position:absolute; left:19px; top:90px; width:395px; height:36px; z-index:1; background-color: #FFFF00; layer-background-color: #FFFF00; border: 1px none #000000;"></div> <div id="Layer1" style="position:absolute; left:19px; top:128px; width:395px; height:36px; z-index:1; background-color: #00FFFF; layer-background-color: #00FFFF; border: 1px none #000000;"></div> лалалалалалалала лалала лалалал алалал алала алалал алалал алалал алал ала лал лал лал ла ла ла лал лала л лал ла лал  <div id="Layer4" style="position:absolute; left:20px; top:14px; width:395px; height:36px; z-index:1; background-color: #00FF00; layer-background-color: #00FF00; border: 1px none #000000;"></div> </body>

Надеюсь понятно !

ну попробуем разобраться
thanx