:first
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since август 2023 г..
Want more support for this feature? Tell us why.
CSS псевдокласс :first используется с @-правилом @page, представляя первую страницу документа при печати.
/* Выбирает первую страницу при печати */
@page :first {
margin-left: 50%;
margin-top: 50%;
}
Примечание:
Вы можете изменять не все CSS-свойства в этом псевдоклассе. Вы можете изменять только внешние отступы, orphans, widows, и разбитие документа на страницы. Более того, вы можете использовать только абсолютные единицы измерения, определяя внешние отступы. Все остальные правила будут проигнорированы.
Синтаксис
Error: could not find syntax for this itemПримеры
HTML
<p>Первая страница.</p>
<p>Вторая страница.</p>
<button>Напечатать</button>
CSS
@page :first {
margin-left: 50%;
margin-top: 50%;
}
p {
page-break-after: always;
}
JavaScript
document.querySelector("button").onclick = function () {
window.print();
};
Результат
Нажмите кнопку "Напечатать", чтобы напечатать пример. Слова на первой странице должны быть примерно в центре, тогда как на остальных страницах надписи будут на своих обычных местах.
Спецификации
| Specification |
|---|
| CSS Paged Media Module Level 3 # first-pseudo |