Как сделать такую таблицу в html css?

Для создания таблицы в HTML с использованием CSS, вам понадобятся следующие шаги:

1. Определите структуру таблицы в HTML:

   <table>
     <thead>
       <tr>
         <th>Заголовок 1</th>
         <th>Заголовок 2</th>
         <th>Заголовок 3</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <td>Ячейка 1.1</td>
         <td>Ячейка 1.2</td>
         <td>Ячейка 1.3</td>
       </tr>
       <tr>
         <td>Ячейка 2.1</td>
         <td>Ячейка 2.2</td>
         <td>Ячейка 2.3</td>
       </tr>
     </tbody>
   </table>

Здесь мы создали таблицу с тремя заголовочными ячейками (<th>) и двумя строками данных (<tr>) с ячейками данных (<td>).

2. Примените стили CSS к таблице:

   table {
     width: 100%;
     border-collapse: collapse;
   }
   th, td {
     padding: 8px;
     text-align: left;
     border-bottom: 1px solid #ddd;
   }
   th {
     background-color: #f2f2f2;
   }

В данном примере мы устанавливаем ширину таблицы на 100% и объединяем границы ячеек с помощью border-collapse: collapse;. Затем мы устанавливаем отступы для заголовочных и данных ячеек, задаем выравнивание текста в ячейках (по левому краю) и добавляем нижнюю границу для каждой ячейки данных с помощью border-bottom: 1px solid #ddd;. Заголовочным ячейкам мы также добавляем фоновый цвет с помощью background-color: #f2f2f2;.

Вы можете настроить эти стили под свои нужды, добавлять цвета, шрифты, размеры и так далее.

3. Построение таблицы с использованием данных из базы данных:
В случае, если вы хотите построить таблицу с использованием данных, полученных из базы данных, вам необходимо использовать серверный язык программирования, такой как PHP или Python, чтобы создать таблицу динамически. Вы можете использовать цикл для обхода данных и создания строк таблицы. Пример на PHP:

   <table>
     <thead>
       <tr>
         <th>Имя</th>
         <th>Фамилия</th>
         <th>Email</th>
       </tr>
     </thead>
     <tbody>
       <?php foreach ($rows as $row): ?>
       <tr>
         <td><?php echo $row['first_name']; ?></td>
         <td><?php echo $row['last_name']; ?></td>
         <td><?php echo $row['email']; ?></td>
       </tr>
       <?php endforeach; ?>
     </tbody>
   </table>

В данном примере мы используем цикл foreach для обхода данных, сохраненных в массиве $rows, и создаем строки таблицы с данными, используя значения из массива.

Конечно, это только базовые примеры создания таблиц в HTML с использованием CSS. Вы можете настраивать и дополнять эти примеры, в зависимости от ваших требований и дизайна.