2013-07-22 5 views
2

Мой HTML-код с этой проблемой, что когда я распечатать вторую страницу, в верхней части этой страницы не имеет никакого перерыва ... вот скриншот печати:HTML печатать вторую страницу без перерыва страницы?

http://tinypic.com/r/ek5fe8/5

То, что я хочу, что есть перерыв на второй странице, перед номером телефона: 765-446-8078

HTML код:

<div class="divTag"> 
      <h4 id="help-header">Planned Parenthood</h4> 
      <p>964 Mezzanine Drive</p> 
      <p>Lafayette, IN 47905</p> 
      <p><a href="tel:765-446-8078">765-446-8078</a></p> 
      <p><a href="http://www.ppin.org">www.ppin.org</a></p> 
     </div> 

у меня уже есть print.css, и я попытался решить эту проблему, написав что-то как:

.divTag p{ 
page-break-before:auto; 

}

Но это не сработало ... Может кто-нибудь дать мне некоторые предложения по этому вопросу, пожалуйста? Thx впереди !!!

P.S: MAC OS, CHROME + FIREFOX + SAFARI имеют ту же проблему.

+0

Учитывайте ограничения, связанные с разрывами страниц, т.е. не применимо к элементу, расположенному в плавающих элементах –

+0

и читайте http://alistapart.com/article/goingtoprint/ –

ответ

0

Попробуйте это:

.divTag p { 
    page-break-before: always; 
} 

«авто» только вставляет разрыв страницы печати, если необходимо определенное браузером.

Кроме того, вы можете обернуть эту CSS так:

@media print { 
    .divTag p { 
     page-break-before: always; 
    } 
} 

Или вы можете использовать этот CSS:

@media print { 
    .page-break { 
     display: block; 
     page-break-before: always; 
    } 
} 

И поставил .page-break класс на элемент, где вы хотите иметь перерыв.

+0

Да, я уже пробовал этот путь. Но это приведет к разрыву страницы в каждом абзаце, поэтому результатом станет: один абзац + огромный разрыв страницы на одной странице (и больше ничего). – Tofuninja173

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