Как сделать HTML страницу из трёх блоков с прокруткой среднего , КриоМух, 25-Окт-23, 09:22 [смотреть все]Доброго дня Уважаемые!Клепаю тут страницу, и хочу чтобы не было JS, а надо в частности мне сделать стандартную штуку: <body> <div id="pgHeader">Тут шапка страницы. Её высота неизвестна</div> <div id="pgContent">Тут собственно блок с содержимым. Он должен быть высотой от шапки до подножья, и если содержимое не влазит, то с прокруткой (но только сам блок с прокруткой, а не страница)</div> <div id="pgFooter">Это подножье страницы, тоже неясна высота. Этот блок должен быть прикреплен к низу экрана.</div> </body> Подскажите как это на CSS сделать? Т.е. шапка и подножье всегда должны быть на своих местах соответственно сверху и снизу, а блок содержимого при необходимости скроллиться.
|
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , abi, 15:46 , 26-Окт-23 (1) +4
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , Аноним, 18:40 , 26-Окт-23 (2) +2
надо делать таблицами. Вот шаблон:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <HTML> <HEAD> </HEAD> <BODY BGCOLOR="#FFFFFF"> <TABLE> <!-- Тут будет верстка --> </TABLE> </BODY> </HTML>
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , КриоМух, 19:06 , 26-Окт-23 (3) +2
>[оверквотинг удален] > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> > <HTML> > <HEAD> > </HEAD> > <BODY BGCOLOR="#FFFFFF"> > <TABLE> > <!-- Тут будет верстка --> > </TABLE> > </BODY> > </HTML> Спасибо, но можно чуточку более развёрнуто, как сделать чтобы ячейка в среднем из 3-х рядов в таблице не растягивалась под своё содержимое? т.е. какой набор трюков нужен над таблицей <table> <tr><td>шапка</td></tr> <tr><td>содержимое + <img style="height:2000px" src="путь_к_большой картинке"><td></tr> <tr><td>подножье</td></tr> </table> , чтобы таблица растянулась на экран, шапка верхняя часть, подножье снизу, а содержимое с огромной картинкой в ячейке у которой скролл по вертикали, которым это содержимое и мотается?
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , Аноним, 19:28 , 27-Окт-23 (5) +2
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , КриоМух, 20:49 , 28-Окт-23 (6) +3
>[оверквотинг удален] > > height: 110px; > > overflow-x: hidden; > > overflow-y: auto; > > text-align:justify; > > } Слушайте, но ведь ясно видно, что данное решение не подходит. В нём подразумевается, что высота div'а известна, она и задаётся в стиле. А я же написал задачу. Что сколько-то вертикали уходит на заголовок, сколько-то на подножье, остальное (неизвестно сколько, зависит от браузера, разрешения у пользователя, от шрифтов и пр.) должно остаться на контент. И в этом соль и есть как отвести ему только оставшееся место на экране. Условия же вопроса вполне однозначно описаны, можно ведь прочитать прежде чем отвечать, и уж тем более прежде чем ворчать не по делу.
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , Аноним, 10:33 , 15-Ноя-23 (7) +3
Высота таблицы 100%, высота заголовка 100px, высота середины не указана, высота футера 100px.
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , КриоМух, 17:13 , 15-Ноя-23 (8) +2
> Высота таблицы 100%, > высота заголовка 100px, > высота середины не указана, > высота футера 100px.Вы таки настаиваете что футер и заголовок должны быть жестко заданной высоты. Но этого нет в условии. Понимаете, вот к примеру в шапке блок H1 с текстом - типа лого, также контакты всякие написаны. В футере тоже что-то текстом оформлено, откуда там знать какую задавать высоту? Ведь это будет зависеть от разрешения, шрифтов и прочих пользовательских условий. Как на форумах любят давать свои условия задач, вместо ответов на вопросы сформулированные вопрошающим. Ужас.
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , Аноним, 01:53 , 10-Фев-24 (9) +1
> Доброго дня Уважаемые!Решили задачку? Как вариант можно было основной каркас обернуть в див со свойством display: flex; Flex-flow: column; Justify-content: space-between; Кажись так А центральному блоку поставить overflow-y: scroll; Но ему скорее всего еще желательно задать св-во height: ...% Ну как-то так
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , КриоМух, 19:46 , 13-Фев-24 (11)
> Кажись так Спасибо огромное, Уважаемый! Именно так получилось. Всё оказалось до неприличия просто
<html> <head><title>test</title></head> <style> body { margin: 0; padding: 0; } #d1 { display: flex; flex-flow: column; background-color: yellow; height: 100vh; width: 50vw; margin: 0 auto; } #d2_1 { background-color: white; } #d2_2 { background-color: blue; height: 99%; overflow-y: scroll; } #d2_3 { background-color: red; } </style> <body> <div id="d1"><!-- Общий блок --> <div id="d2_1">ШАПКА ТУТ</div><!-- Шапка --> <div id="d2_2">Содержимое тут</div><!-- Содержимое --> <div id="d2_3">Подножье тут</div><!-- Подножье --> </div> </body> </html>
- Как сделать HTML страницу из трёх блоков с прокруткой среднего , Аноним, 10:02 , 10-Фев-24 (10)
На stallman.org те самые три блока посмотри.
|