Здравствуйте, я надеюсь, что кто-то может помочь мне с этой проблемой. В основном у меня возникла проблема со страничным перерывом, позвольте мне разбить каждый маленький шаг, который я сделал:Page-Break не работает должным образом
# 1 Первоначально у меня была проблема с разрывом страницы, используя window.print(), из-за того, что я был используя тег таблицы.
@media print {
@page :first{
margin-top:1cm;
}
@page {
margin-top:3cm;
}
}
h1, h2, h3, h4, div, table, tr, td, th{
font-family:Arial, Helvetica, sans-serif;
border-collapse:collapse;
width:auto;
margin:11px;
}
.cuerpo{
position:relative;
top:200px;
right:9px;
font-size:9px;
}
.cuerpo{
padding-top:150px;
font-size:9px;
font-weight:500;
page-break-after:always;
}
.cuerpo tr {
padding:3px;
line-height:15px;
height:10px;
width:15px;
}
.cuerpo tbody td, .cuerpo thead th{
border:1px solid #000000;
padding:1px;
}
http://jsfiddle.net/the_best/u99BQ/
# 2 Тогда я нашел в форуме, что страница разбития работает с 'дисплей: блок;' вместо этого и изменил размер шрифта: 13 пикселей, поэтому он не выглядит слишком большим и может поместиться также на бумаге. Я добавил, что конкретная строка кода в css это то, что произошло: , если вы попробуете font-size = 100% сломается правильно, но это будет выглядеть слишком большим.
@media print {
@page :first{
margin-top:1cm;
}
@page {
margin-top:3cm;
}
}
h1, h2, h3, h4, div, table, tr, td, th{
font-family:Arial, Helvetica, sans-serif;
border-collapse:collapse;
}
thead tr .ancho {
width:95;
width:80;
}
#nombre-hotel {
text-align:center;
}
#cuerpo{
page-break-inside:avoid;
padding-top:150px;
position:relative;
top:50px;
border-collapse:collapse;
font-size:90%;
}
#cuerpo tr{
page-break-inside:avoid;
page-break-after:auto;
/*page-break-after:auto;*/
display:block;
/*padding:3px;
line-height:15px;
height:10px;
width:15px;*/
}
#cuerpo td, #cuerpo th{
page-break-inside:avoid;
border:solid 1px #CCCCCC;
}
http://jsfiddle.net/the_best/VwTa7/
В основном речь идет, чтобы получить страницу прорывы прямо с соответствующим размером шрифта, а также и выровнять клетки. К сожалению, это не для меня. Если кто-то может мне помочь, я буду очень признателен. Если вам нужна подробная информация, просто дайте мне знать.
Не работает на скрипке, которую вы опубликовали. Я думаю, вы упускаете из виду тот факт, что если вы не добавите «display: block;» на #cuerpo tr он не будет разбиваться на страницы. Поскольку, насколько я узнал, свойство разбиения на страницы работает только на элементах блока, поэтому я пытаюсь получить чистый результат с помощью дисплея: если возможно, блок. Если есть другой способ, я буду знать. – user2989570