Редактор Онлайн

<html>
<head>
<style type="text/css">
#customers
{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
width:100%;
border-collapse:collapse;
}
#customers td, #customers th 
{
font-size:1.0em;
border:1px solid #005efe;
padding:3px 7px 2px 7px;
}
#customers th 
{
font-size:1.2em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color:#90b0dd;
color:#fff;
}
#customers tr.alt td 
{
color:#000;
background-color:#EAF2D3;
}
</style>
<link rel="stylesheet" type="text/css" href="https://setmar.ru/imgs/css/style.css">

</head>

<body>
<table id="customers">
<tr>
  <th>Книга</th>
  <th>Автор</th>
  <th>Категория</th>
</tr>
<tr>
<td>Приключения Тома Сойера</td>
<td>Марк Твен</td>
<td>Художественная</td>
</tr>
<tr class="alt">
<td>Гордость и предубеждение</td>
<td>Джейн Остен</td>
<td>Художественная</td>
</tr>
<tr>
<td>Происхождение видов</td>
<td>Чарльз Дарвин</td>
<td>Научная</td>
</tr>
<tr class="alt">
<td>Лавка древностей</td>
<td>Чарльз Диккенс</td>
<td>Художественная</td>
</tr>
<tr>
<td>Ромео и Джульетта</td>
<td>Вильям Шекспир</td>
<td>Пьеса</td>
</tr>
<tr class="alt">
<td>Вий</td>
<td>Максим Гоголь</td>
<td>Мистика</td>
</tr>
<tr>
<td>Кинжал челлини</td>
<td>Джеймс Х. Чейз</td>
<td>Детектив</td>
</tr>
</table>
</body>
</html>

Ваш Результат:

Отредактируйте код сверху и кликните кнопку, чтобы посмотреть результат.

Уроки CSS - Попробуйте сами