Я пытаюсь реализовать свой стол с полосой прокрутки, которая будет состоять только из 10 команд, пока она не заставит вас прокручивать вниз. Тем не менее, я не могу получить право кодирования.
Я планирую реализовать прокручиваемую таблицу на нескольких разных страницах, в которых заголовки столбцов будут меняться по ширине. Все примеры, которые я нашел, требуют фиксированной ширины для каждого столбца, есть ли лучший способ сделать это?
** Я хочу сохранить фиксированные заголовки **
Вот мой PHP-код:
echo '<table align="center" cellspacing="3" cellpadding="3" width="80%" border="1">
<tr>
<th align="center">Team Name</th>
<th align="center">Wins</th>
<th align="center">Losses</th>
<th align="center">Winning %</th>
</tr><div id="scrll_tbl">';
$bg = '#eeeeee';
for($i = 0; $i < count($teams); $i++) {
$bg = ($bg == '#eeeeee' ? '#fffffff' : '#eeeeee');
$wnpctg = $teams[$i][1] / ($teams[$i][1] + $teams[$i][2]);
echo '<tr bgcolor="' .$bg. '">
<td align="center">' . $teams[$i][0] . '</td>
<td align="center">' . $teams[$i][1] . '</td>
<td align="center">' . $teams[$i][2] . '</td>
<td align="center">' . number_format($wnpctg,3) . '</td>
</tr>';
}
echo '</div></table>';
и вот мой CSS:
#scrll_tbl {
overflow: scroll;
height: 100px;
}
На самом деле вы не можете иметь тег div внутри таблицы (он будет отображаться вне таблицы как пустой div). Единственный способ иметь фиксированный заголовок - иметь две таблицы и вторую таблицу внутри прокручиваемого div. Если вам нужна гибкая ширина для ячеек таблицы, вы можете использовать JavaScript для проверки ширины ячеек таблицы первой строки ваших данных и соответственно установить ширину ячейки заголовка.