Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.83/30: Рейтинг темы: голосов - 30, средняя оценка - 4.83
 Аватар для Сергей1980
547 / 377 / 16
Регистрация: 17.12.2009
Сообщений: 991

Прокрутка tbody

09.10.2013, 13:39. Показов 5665. Ответов 2
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Привет всем !!
Ребят, помогите пожалуйста.
Есть стандартная таблица HTML в которой есть <thead> и <tbody> соответственно:



Подскажите пожалуйста, как грамотно по феншую организовать фиксацию шапки <thead>, c нормальной прокруткой
тела таблицы <tbody> по вертикали?
У меня почему то сбилось позиционирование заголовков <th> в шапке <thead>, они не такой же ширины как <td> в теле
<tbody>.
Подскажите пожалуйста решение с позиции CSS. Чтобы заголовок таблицы был зафиксирован, а тело таблицы имело нормальный скролинг, и поля были в шапке и теле одинаковой ширины.
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
09.10.2013, 13:39
Ответы с готовыми решениями:

Прокручивать tbody
Здравствуйте. Собственно сабж. Нужно задать тегу tbody фиксированную высоту и сделать ему вертикальный скролл. Но просто это: tbody {...

Прокручивающийся tbody
Всем привет! У меня страница растягивается на всю высоту и ширину, нужно чтобы прокрутка была только в tbody. Код не ниже не...

Отсуп от бордера таблицы до tbody
Товарищи, а не подскажете как сделать оступ от содержимого до границы таблицы? Нельзя использовать никаких обёрток типа второго table или...

2
112 / 112 / 18
Регистрация: 24.09.2013
Сообщений: 509
09.10.2013, 15:34
тоже интересует решение такого вопроса
0
 Аватар для Сергей1980
547 / 377 / 16
Регистрация: 17.12.2009
Сообщений: 991
09.10.2013, 15:43  [ТС]
уже расковырял проблему:

Вот бери:

CSS
1
2
3
4
5
6
7
8
<style type="text/css">
table { font: 8pt Arial; border-collapse: collapse; }
table td { border: 1px solid #acacac; padding: 5px 25px; text-align: center; width: 80px; }
 
.withScroll table thead, .withScroll table tbody { display: block; } 
.withScroll table tbody { height: 100px; overflow: auto; margin-top: -1px; }
.withScroll table thead td:last-child { width: 80px; }
</style>
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
09.10.2013, 15:43
Помогаю со студенческими работами здесь

Применить стиль только к tbody
Объявляю стиль таблицы tr:hover{ background:#F9F; cursor:pointer; } TABLE {background:white; border-collapse: collapse; } TH...

Зачеркнутый текст к классу в <tbody>
Добрый день! Хочу прописать стиль, к классу col-field, чтобы текст был зачёркнутый, то есть .col-field {text-decoration: line-through;}...

Как работает тег tbody?
Всем привет! скажите пожалуйста как работает тег tbody? в каких случаях используется? видел много примеров,не вижу разницы что с ним что...

Установить css только для тех ячеек, которые находятся в tbody
Здравствуйте! Подскажите пожалуйста как установить css только для тех ячеек, которые находятся в tbody? Например, увеличить расстояние...

Параллельная вертикальная прокрутка двух блоков и отдельная горизонтальная прокрутка одного из двух блоков
Всем привет! Помогите решить проблему, пожалуйста. Есть блок div, внутри которого два блока div (в каждом из них по одной таблице),...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Новые блоги и статьи
Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android
8Observer8 26.01.2026
Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .
Установка Android SDK, NDK, JDK, CMake и т.д.
8Observer8 25.01.2026
Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .
Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf
8Observer8 25.01.2026
Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .
Использование SDL3-callbacks вместо функции main() на Android, Desktop и WebAssembly
8Observer8 24.01.2026
Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
моя боль
iceja 24.01.2026
Выложила интерполяцию кубическими сплайнами www. iceja. net REST сервисы временно не работают, только через Web. Написала за 56 рабочих часов этот сайт с нуля. При помощи perplexity. ai PRO , при. . .
Модель сукцессии микоризы
anaschu 24.01.2026
Решили писать научную статью с неким РОманом
http://iceja.net/ математические сервисы
iceja 20.01.2026
Обновила свой сайт http:/ / iceja. net/ , приделала Fast Fourier Transform экстраполяцию сигналов. Однако предсказывает далеко не каждый сигнал (см ограничения http:/ / iceja. net/ fourier/ docs ). Также. . .
http://iceja.net/ сервер решения полиномов
iceja 18.01.2026
Выкатила http:/ / iceja. net/ сервер решения полиномов (находит действительные корни полиномов методом Штурма). На сайте документация по API, но скажу прямо VPS слабенький и 200 000 полиномов. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru