PHP / HTML / CSS Таблица прокрутки

0

Я пытаюсь реализовать свой стол с полосой прокрутки, которая будет состоять только из 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;
}
  • 0
    Вы пытаетесь загрузить больше данных, когда прокрутка достигает конца страницы?
  • 0
    Нет, данные загружаются до загрузки страницы
Показать ещё 4 комментария
Теги:
html-table
scroll

1 ответ

0

На самом деле вы не можете иметь тег div внутри таблицы (он будет отображаться вне таблицы как пустой div). Единственный способ иметь фиксированный заголовок - иметь две таблицы и вторую таблицу внутри прокручиваемого div. Если вам нужна гибкая ширина для ячеек таблицы, вы можете использовать JavaScript для проверки ширины ячеек таблицы первой строки ваших данных и соответственно установить ширину ячейки заголовка.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню