Заметки дизайнера » Изменение фона в таблице

Подсветка ссылки Кроссбраузерное выравнивание по центру

Изменение фона в таблице

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

<br />
<table id=table onMouseover="table.bgColor='red'" onMouseOut="table.bgColor='white'" bgcolor=white border=1>
<tr>
<td>
При наведении курсора мышки на таблицу она поменяет цвет.
</td>
</tr>
</table>
<p>

При наведении мышки на область таблицы она изменит цвет с белого на красный. Соответственно, когда курсор мышки вновь покинет эту область, она вновь станет белой.

Аналогичным образом можно менять не только цвет, но и фоновый рисунок таблицы.

А вот ещё небольщой пример, который демонстрирует, как можно с помощью CSS динамически обвести таблицу контуром:

<br />
<table id=tabl1e onMouseover="table1.border=&#392;" onMouseOut="table1.border=0'" border=0>
<tr>
<td>
<a href=#>При наведении курсора мышки на таблицу она очертится контуром;/a><br />
</a></td>
</tr>
</table>
<p>

Как Вы можете заметить, CSS даёт достаточно немалые возможности создания динамической страницы для последующего отображения в Internet Explorer. Для Netscape Navigator, чтобы реализовать что-то подобное, требуется либо использовать графические элементы, либо слои. Однако фиксация шрифтов работает и для того и для другого броузера так же, как и реализация не подчеркнутых ссылок, а это уже даёт неплохое поле для деятельности.

Добавить в: