html - 分页符在 div 中不起作用。如何添加此标签?

标签 html css

page-break-before 在任何情况下都不起作用。我包含在不同的标签(div、p 和 h1)中并添加了显示 block ,但显示更改了布局。如何在开头添加分页符?

我曾尝试在 之前的 div 中包含 page-break-before,在最后一个 div 之后包含 page-break-before 但是当我放置打印预览时它似乎不起作用。我所做的所有页面都与下面的代码相同。

<h1 class="page-title" style="font-weight: 1000"><img width="6%" src="../../assets/admin/layout/img/icon_anamnese.png" alt="...">&nbsp;Anamnese</h1>

<div class="row">
  <div class="col-md-12">
    <div class="portlet-body">
      <div class="table-scrollable">
        <table class="table col-md-12">
          <tbody>
            <tr>
              <td style="background-color: #8fc4c4 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Objetivos com relação à atividade física?</td>
              <td style="background-color: #f6fdfd !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">Saúde e Bem estar</td>
            </tr>
            <tr>
              <td style="background-color: #aadee0 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Pratica atividade física atualmente?</td>
              <td style="background-color: #dff7f7 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">De duas a três vezes por semana</td>
            </tr>
            <tr>
              <td style="background-color: #8fc4c4 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Utiliza algum tipo de medicamento?</td>
              <td style="background-color: #f6fdfd !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">Não</td>
            </tr>
            <tr>
              <td style="background-color: #aadee0 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Já passou por alguma cirurgia?</td>
              <td style="background-color: #dff7f7 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">Lesão de natureza articular</td>
            </tr>
            <tr>
              <td style="background-color: #8fc4c4 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Doenças na família?</td>
              <td style="background-color: #f6fdfd !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">Diabetes</td>
            </tr>
            <tr>
              <td style="background-color: #aadee0 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-5 lead">Observações</td>
              <td style="background-color: #dff7f7 !important; -webkit-print-color-adjust: exact; color: #3d !important; -webkit-print-color-adjust: exact" class="col-md-7 lead">Dores musculares após atividades físicas</td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div><br /><br /><br />

最佳答案

你有没有试过像这样把它放在样式标签中:

<div style="page-break-before: always;" class="row"></div>

还要确保你的 div 是 block 状的而不是内联的

关于html - 分页符在 div 中不起作用。如何添加此标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56027530/

相关文章:

html - 卡头的 Bootstrap 垂直对齐

html - CSS 过渡在下拉菜单中不起作用

javascript - 将 TD 值复制到 TD 内动态创建的输入

javascript - 更好地按屏幕尺寸处理台式机、手机和平板电脑或检测平板电脑/手机/台式机?

javascript - 无法在 :checked pseudo code with selector in CSS 中使用多个 ':nth-child'

html - 如何使用模板生成静态网页?

javascript - 将 st、th、rd 添加到 jQuery 日期

html - 将带有背景图像的 div 更改为带过渡的彩色背景

css - 在内容很少的页面底部强制页脚

html - 是否可以使我的固定菜单响应?