CSS по шагам



Пример 16.3. Выделение строк таблицы


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<style type="text/css">

TR:hover {

background: #fc0; /* Меняем цвет фона строки таблицы */

}

</style>

</head>

<body>

<table width="400" border="1" cellpadding="4" cellspacing="0">

 <tr>

  <th>&nbsp;</th>

  <th>Пики</th>

  <th>Трефы</th>

  <th>Бубны</th>

  <th>Червы</th>

 </tr>

 <tr>

  <td>Чебурашка</td>

  <td>5</td>

  <td>2</td>

  <td>4</td>

  <td>2</td>

 </tr>

 <tr>

  <td>Крокодил Гена</td>

  <td>2</td>

  <td>7</td>

  <td>1</td>

  <td>3</td>

 </tr>

 <tr>

  <td>Шапокляк</td>

  <td>5</td>

  <td>4</td>

  <td>3</td>

  <td>1</td>

 </tr>

 <tr>

  <td>Крыса Лариса</td>

  <td>1</td>

  <td>0</td>

  <td>5</td>

  <td>7</td>

 </tr>

</table>

</body>

</html>

Результат примера показан ниже.

TABLE.ex3 TR:hover { background: #fc0}

 

Пики

Трефы

Бубны

Червы

Чебурашка 5 2 4 2
Крокодил Гена 2 7 1 3
Шапокляк 5 4 3 1
Крыса Лариса 1 0 5 7




Содержание  Назад  Вперед