Я определил страницу HTML/CSS для печати, в которой используются функции CSS @Page, чтобы определить заголовок и нижний колонтитул.
На первой странице я не хочу нижний колонтитул. Здесь удалите заголовок с первой страницы HTML -сгенерированного PDF - CSS. Описано, как я удаляю нижний колонтитул в смысле «не показывать его». Это работает, но, к сожалению, какое -то место по -прежнему зарезервировано для нижнего колонтитула. Когда я захочу разместить элемент близко к концу титульного страницы, он не будет работать, он будет обернут на следующую страницу. Я использую Weasyprint для перевода HTML/CSS в PDF.
html:
test
some header left
some header right
some content
some more content
Section 1
Section 2
Section 3
< /code>
css: (класс с низким уровнем детективы имеет свойство с полом. Когда вы удаляете комментарий, элемент будет перенесен на следующую страницу) < /p>
body {
font-family: 'Arial';
margin: 0px;
}
* {
margin: 0;
padding: 0;
white-space: nowrap;
}
@media print {
h2 {
page-break-before: always;
}
h3, h4 {
page-break-after: avoid;
}
pre, blockquote {
page-break-inside: avoid;
}
html, body {
width: 297mm;
height: 210mm;
}
}
@page {
size: A4 landscape;
margin-top: 90px;
margin-left: 0;
margin-right: 0;
/*
* Header
*/
@top-left{
content: element(header-left);
/* margin-top: 27mm; */
}
@top-center{
height: 90px;
}
@top-right{
content: element(header-right);
height: 90px;
}
/*
* Footer
*/
@bottom-right {
content: element(footer-right);
background-color: yellow;
margin-top: 20px;
padding-right: 34px;
width: 450px;
height: 50px;
}
@bottom-center{
content: counter(page) ' / ' counter(pages);
background-color: yellow;
margin-top: 20px;
font-family: 'Arial';
color: white;
width: 222px;
height: 50px;
}
@bottom-left{
content: string(heading);
background-color: yellow;
margin-top: 20px;
padding-left: 35px;
font-family: 'Arial';
color: white;
width: 450px;
height: 50px;
}
}
/*
* Title page, we remove the footer here
*/
@page:first {
@bottom-right {
content: normal;
}
@bottom-center{
content: normal;
}
@bottom-left{
content: normal;
}
}
/*
* Header
*/
.header-left {
position: running(header-left);
width: 800px;
margin-left: 35px;
}
.header-right {
position: running(header-right);
margin-right: 35px;
margin-top: 10px;
}
h2 { string-set: heading content() }
.footer-right {
display: flex;
justify-content: flex-end;
align-items: center;
height: 50px;
position: running(footer-right);
}
.main-image-and-sub {
margin-left: 5px;
margin-top: 20px;
height: 496px;
}
.lower-detail-box {
display: flex;
justify-content: space-between;
align-items: center;
height: 111px;
/* margin-top: 10px; */
margin-left: 35px;
margin-right: 33px;
background-color: lightblue;
}
Подробнее здесь: https://stackoverflow.com/questions/681 ... first-page
CSS: Удалите нижний файл @page на первой странице ⇐ Html
Программисты Html
-
Anonymous
1743459969
Anonymous
Я определил страницу HTML/CSS для печати, в которой используются функции CSS @Page, чтобы определить заголовок и нижний колонтитул.
На первой странице я не хочу нижний колонтитул. Здесь удалите заголовок с первой страницы HTML -сгенерированного PDF - CSS. Описано, как я удаляю нижний колонтитул в смысле «не показывать его». Это работает, но, к сожалению, какое -то место по -прежнему зарезервировано для нижнего колонтитула. Когда я захочу разместить элемент близко к концу титульного страницы, он не будет работать, он будет обернут на следующую страницу. Я использую Weasyprint для перевода HTML/CSS в PDF.
html:
test
some header left
some header right
some content
some more content
Section 1
Section 2
Section 3
< /code>
css: (класс с низким уровнем детективы имеет свойство с полом. Когда вы удаляете комментарий, элемент будет перенесен на следующую страницу) < /p>
body {
font-family: 'Arial';
margin: 0px;
}
* {
margin: 0;
padding: 0;
white-space: nowrap;
}
@media print {
h2 {
page-break-before: always;
}
h3, h4 {
page-break-after: avoid;
}
pre, blockquote {
page-break-inside: avoid;
}
html, body {
width: 297mm;
height: 210mm;
}
}
@page {
size: A4 landscape;
margin-top: 90px;
margin-left: 0;
margin-right: 0;
/*
* Header
*/
@top-left{
content: element(header-left);
/* margin-top: 27mm; */
}
@top-center{
height: 90px;
}
@top-right{
content: element(header-right);
height: 90px;
}
/*
* Footer
*/
@bottom-right {
content: element(footer-right);
background-color: yellow;
margin-top: 20px;
padding-right: 34px;
width: 450px;
height: 50px;
}
@bottom-center{
content: counter(page) ' / ' counter(pages);
background-color: yellow;
margin-top: 20px;
font-family: 'Arial';
color: white;
width: 222px;
height: 50px;
}
@bottom-left{
content: string(heading);
background-color: yellow;
margin-top: 20px;
padding-left: 35px;
font-family: 'Arial';
color: white;
width: 450px;
height: 50px;
}
}
/*
* Title page, we remove the footer here
*/
@page:first {
@bottom-right {
content: normal;
}
@bottom-center{
content: normal;
}
@bottom-left{
content: normal;
}
}
/*
* Header
*/
.header-left {
position: running(header-left);
width: 800px;
margin-left: 35px;
}
.header-right {
position: running(header-right);
margin-right: 35px;
margin-top: 10px;
}
h2 { string-set: heading content() }
.footer-right {
display: flex;
justify-content: flex-end;
align-items: center;
height: 50px;
position: running(footer-right);
}
.main-image-and-sub {
margin-left: 5px;
margin-top: 20px;
height: 496px;
}
.lower-detail-box {
display: flex;
justify-content: space-between;
align-items: center;
height: 111px;
/* margin-top: 10px; */
margin-left: 35px;
margin-right: 33px;
background-color: lightblue;
}
Подробнее здесь: [url]https://stackoverflow.com/questions/68135766/css-remove-page-footer-on-the-first-page[/url]
Ответить
1 сообщение
• Страница 1 из 1
Перейти
- Кемерово-IT
- ↳ Javascript
- ↳ C#
- ↳ JAVA
- ↳ Elasticsearch aggregation
- ↳ Python
- ↳ Php
- ↳ Android
- ↳ Html
- ↳ Jquery
- ↳ C++
- ↳ IOS
- ↳ CSS
- ↳ Excel
- ↳ Linux
- ↳ Apache
- ↳ MySql
- Детский мир
- Для души
- ↳ Музыкальные инструменты даром
- ↳ Печатная продукция даром
- Внешняя красота и здоровье
- ↳ Одежда и обувь для взрослых даром
- ↳ Товары для здоровья
- ↳ Физкультура и спорт
- Техника - даром!
- ↳ Автомобилистам
- ↳ Компьютерная техника
- ↳ Плиты: газовые и электрические
- ↳ Холодильники
- ↳ Стиральные машины
- ↳ Телевизоры
- ↳ Телефоны, смартфоны, плашеты
- ↳ Швейные машинки
- ↳ Прочая электроника и техника
- ↳ Фототехника
- Ремонт и интерьер
- ↳ Стройматериалы, инструмент
- ↳ Мебель и предметы интерьера даром
- ↳ Cантехника
- Другие темы
- ↳ Разное даром
- ↳ Давай меняться!
- ↳ Отдам\возьму за копеечку
- ↳ Работа и подработка в Кемерове
- ↳ Давай с тобой поговорим...
Мобильная версия