Как добавить фиксированный верхний и нижний колонтитулы для динамического содержимого на каждой странице при печати в формате HTML?

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

Содержимое страницы является динамическим, а span/div может распространяться на несколько страниц. Позиция для разрыва страницы не может быть определена, поскольку содержимое находится в одном div или промежутке.

Я попытался добавить div и теги заголовка и нижнего колонтитула. Но верхний и нижний колонтитулы отображаются только один раз в начале первой страницы и в конце последней страницы соответственно. Есть ли способ печати на каждой странице?

источник

2016-08-08 Rashid

Вы можете сделать заголовок в div и сделать его положение неподвижным. и, далее, макет должен быть таким же. Вам нужно установить несколько элементов CSS для установки заголовка как фиксированного. –

Это дублированный вопрос: http://stackoverflow.com/questions/1360869/how-to-use-html-to-print-header-and-footer-on-every-printed-page-of-a-document -w? rq = 1 –

HTML

<div class="header">HEADER GOES HERE</div> 
<div class="content">content content content</div> 
<div class="footer">FOOTER GOES HERE</div>

CSS

@media print{ 
    .header{ 
    position: fixed; 
    top: 0; 
    } 
    .footer{ 
    position: fixed; 
    bottom: 0; 
    } 
} 

@media screen{ 
    .header{ 
    display:none; 
    } 
    .footer{ 
    display:none; 
    } 
}

Вы должны будете играть вокруг с полями, чтобы ваш верхний и нижний колонтитулы не перекрывает контент хотя

источник

2016-08-08 06:34:36 derp

Это не работает, если содержимое основного div продолжается до 2 или более страниц (например, большой абзац). В этом случае нижний колонтитул отображается только на последней странице и заголовке только на первой странице, а не на страницах между ними. Мне нужен верхний и нижний колонтитул на каждой странице для любого количества страниц. – Rashid

изменен опечатка с экрана для печати для первого селектора. Он будет отображаться на каждой странице в предварительном просмотре печати. – derp

Если вы прокрутите страницу до конца и затем попытаетесь распечатать, позиция верхнего и нижнего колонтитула будет перемещена в предварительном просмотре. – Rashid

Попробуйте использовать position: fixed; он должен работать на это.

источник

2016-08-08 11:51:16

Как добавить фиксированный верхний и нижний колонтитулы для динамического содержимого на каждой странице при печати в формате HTML?

ответ

Смежные вопросы