Обнаружить и обработать условие "разрыв страницы" в CSS?

По общему признанию, это XY проблема. X - это Как использовать HTML для печати верхнего и нижнего колонтитула на каждой печатной странице документа?, как это работает в Safari 11.1.1. Однако вопрос это касается именно проблемы, с которой я столкнулся с моим подходом Y, описанным ниже!

Для моего документа (резюме) у меня есть небольшое фиксированное количество возможных позиций "разрыва страницы", принудительно с помощью page-break-inside: avoid. Мне пришло в голову, что если бы я мог программно обнаружить место разрыва страницы действительный, то я мог бы использовать это для де-display:none элемента нижнего колонтитула, который я ранее установил в этом месте. То есть мой документ сейчас выглядит так:

.nobreak {
    page-break-inside: avoid;
}
.footer {
    display: none;
}

    <div class = "nobreak">
    <h2>Professional Affiliations</h2>
    <ul id = "affiliations"> ... </ul>
    </div>

<div class = "footer">footer text</div>

    <div class = "nobreak">
    <h2>Licensure</h2>
    <ul id = "licensure"> ... </ul>
    </div>

<div class = "footer">footer text</div>

    <div class = "nobreak">
    <h2>Publications</h2>
    <ul id = "publications"> ... </ul>
    </div>

<div class = "footer">footer text</div>

Есть ли какой-нибудь полунадежный способ определить, находится ли один из этих элементов «нижнего колонтитула» внизу физической страницы (media print), и настроить его свойство display на основе этого?

Я сильно подозреваю, что это невозможно - потому что недавно обнаруженный элемент нижнего колонтитула приведет к перекомпоновке страницы и перемещению элемента нижнего колонтитула и т. д. В бесконечном регрессе - но я нигде не видел, чтобы это обсуждалось, поэтому я подумал, что должен попросить окончательный ответ.

Так в основном вам нужен нижний колонтитул для каждой напечатанной страницы?

SirPilan 25.06.2018 20:35

@Pilan: Да, «верхний и / или нижний колонтитулы на каждой печатной странице» - это проблема X; но решения проблемы X следует публиковать в виде ответов на stackoverflow.com/questions/1360869/…. Вопрос Этот ищет ответы, в частности, о том, как отобразить существующий элемент, если он обнаружен как вверху и / или внизу страницы печати.

Quuxplusone 25.06.2018 20:40

Хорошо, я вижу, это странный Y: D

SirPilan 25.06.2018 20:43

Недавно я пытался сделать что-то подобное и не смог найти способ сделать это окончательно. Однако я, похоже, добился определенного успеха, если предположил, что страница будет иметь высоту x пикселей, исходя из ожидаемого (или принудительного) соотношения сторон печати. Это сработало в моем случае, но, безусловно, могло сломаться, учитывая, что другие машины печатали.

Ryan Gibbs 26.06.2018 01:05
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
3
4
1 115
0

Другие вопросы по теме