css中page-break-after: always;在火狐瀏覽器上不執行的解決方法-css教學-PHP中文網

首頁

web前端

css教學

css中page-break-after: always;在火狐瀏覽器上不執行的解決方法

黄舟

Jul 08, 2017 am 10:02 AM

firefox webkit

page-break-after: always;火狐瀏覽器上不執行

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>分页打印</title>
</head>

<body>
    <object id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0 ></object>
    <table border="0" style="font-size:9pt;" width="300px" align="center">
        <thead style="display:table-header-group; font-weight:bold">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double red">
                    每页都有的表头
               </td>
           </tr>
        </thead>
        <tbody>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr style=" page-break-after : always;">
                <td>在这个之后分页</td>
                <td>在这个之后分页</td>
           </tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
           <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
           <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
       </tbody>
       <tfoot style="display:table-footer-group; font-weight:bold">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double blue">
                  每页都有的表尾
               </td>
           </tr>
        </tfoot>
    </table>
  <div align="center">
       <input type="button" value="打    印" onclick="javascript:window.print()" />
    </div>
</body>
</html>

登入後複製

page-break-after: always;火狐不執行。 IE上面卻可以。怎麼做相容

css中page-break-after: always;在火狐瀏覽器上不執行的解決方法

Google對page-break-after的支援有問題，特別是table，需要將資料拆開，用div來做容器

你可以改成這樣的結構，透過列印樣式來控制，沒有問題。。

<!DOCTYPE html>
 <html>
  <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>Paginated HTML</title>
    <style type="text/css" media="print">
      div.page{page-break-after: always;page-break-inside: avoid;}
      .hide{display:table-header-group !important}
    </style>
    <style type="text/css">
      .hide{display:none}
    </style>
  </head>
  <body>
    <div class="page"><table border="0" style="font-size:9pt;" width="300px" align="center">
        <thead style="display:table-header-group; font-weight:bold">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double red">
                    每页都有的表头
               </td>
           </tr>
        </thead>
        <tbody>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr>
                <td>在这个之后分页</td>
                <td>在这个之后分页</td>
           </tr>
       </tbody>
       <tfoot style="font-weight:bold" class="hide">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double blue">
                  每页都有的表尾
               </td>
           </tr>
        </tfoot>
    </table>
    </div>
    <div class="page">
      <table border="0" style="font-size:9pt;" width="300px" align="center">
        <thead style="font-weight:bold" class="hide">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double red">
                    每页都有的表头
               </td>
           </tr>
        </thead>
        <tbody>
            <tr><td>表格内容</td><td>表格内容</td></tr>
           <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
           <tr><td>表格内容</td><td>表格内容</td></tr>
            <tr><td>表格内容</td><td>表格内容</td></tr>
       </tbody>
       <tfoot style="display:table-footer-group; font-weight:bold">
            <tr>
               <td colspan="2" align="center" style="font-weight:bold; border:3px double blue">
                  每页都有的表尾
               </td>
           </tr>
        </tfoot>
    </table><div align="center">
       <input type="button" value="打    印" onclick="javascript:window.print()" />
    </div>
    </div>

  </body>
</html>

登入後複製

以上是css中page-break-after: always;在火狐瀏覽器上不執行的解決方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！

本網站聲明

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

熱AI工具

熱工具

熱門話題

gmail信箱登陸入口在哪裡

7849

Java教學

1649

CakePHP 教程

1403

Laravel 教程

1300

PHP教程

1241

Related knowledge

Ubuntu Linux如何移除Firefox Snap？ Feb 21, 2024 pm 07:00 PM

要在UbuntuLinux中刪除FirefoxSnap，可以按照以下步驟進行操作：打開終端機並以管理員身份登入Ubuntu系統。執行以下命令以卸載FirefoxSnap：sudosnapremovefirefox系統將提示你輸入管理員密碼。輸入密碼並按下Enter鍵以確認。等待指令執行完成。一旦完成，FirefoxSnap將被完全刪除。請注意，這將刪除透過Snap套件管理器安裝的Firefox版本。如果你透過其他方式（如APT套件管理器）安裝了另一個版本的Firefox，則不會受到影響。透過上述步驟

mozilla firefox可以卸載嗎 Mar 15, 2023 pm 04:40 PM

mozilla firefox可以卸載；firefox屬於第三方瀏覽器，如果不需要，完全可以卸載。卸載方法：1、在開始功能表中，依序點選「Windwos系統」-「控制台」；2、在「控制台」介面中，點選「程式與功能」；3、在新介面中，找到並雙擊火狐瀏覽器圖示；4、在卸載彈窗中，點選「下一步」；5、點選「卸載」即可。

火狐瀏覽器Firefox 113 新特性：支援AV1動圖、增強密碼產生器與畫中畫特性 Mar 05, 2024 pm 05:20 PM

近日消息，Mozilla在發布Firefox112穩定版的同時，也宣布下個主要版本Firefox113進入Beta頻道，支援AV1動圖、增強密碼產生器和畫中畫特性。火狐瀏覽器Firefox113主要新功能/新特性如下支援AV1格式動圖(AVIS)透過引入特殊字元來增強密碼產生器的安全性增強畫中畫功能，支援後退、顯示影片時間，能更輕鬆地啟用全螢幕模式為Debian和Ubuntu發行版提供官方DEB安裝檔更新書籤導入功能，預設支援導入書籤的圖示在支援的硬體上預設啟用硬體加速AV1視訊解碼使用w

Scrapy中如何使用Mozilla Firefox來解決掃碼登入的問題？ Jun 22, 2023 pm 09:50 PM

對於爬蟲爬取需要登入的網站，驗證碼或掃碼登入是一個很困擾的問題。 Scrapy是Python中一個非常好用的爬蟲框架，但在處理驗證碼或掃碼登入時，需要採取一些特殊的措施。作為一個常見的瀏覽器，MozillaFirefox提供了一個解決方案，可以幫助我們解決這個問題。 Scrapy的核心模組是twisted，它只支援非同步請求，但有些網站需要使用cookie和

Apple 發布更新以修復 MacBook 中的 WebKit 漏洞和過度耗電 Apr 15, 2023 am 10:49 AM

Apple已發布適用於iPhone、iPad、Mac和AppleWatch的更新。儘管每個設備的更新都很小，但它們解決了WebKit漏洞。該公司還保證已經修復了一個錯誤，該錯誤會導致MacBook筆記型電腦意外耗盡電池。 AppleiOS和iPadOS15.3.1是次要更新。它實際上不包含任何主要功能。但是，它對使用點字顯示器的人很有用。此外，該更新還解決了任意程式碼執行漏洞。 iOS15.3.1的更新說明提到：iOS15.3.1為您的iPhone提供了重要的安全更新，並修

Ubuntu 23.10預設將在原生 Wayland 模式下執行火狐瀏覽器 Firefox Feb 29, 2024 am 10:10 AM

Canonical公司近日宣布，在即將發布的Ubuntu23.10中，FirefoxSnap已配置預設在Wayland模式下運作。註：Ubuntu目前已經預設Wayland會話，Firefox也能正常運作。不過目前FirefoxSnap其實是以XWayland相容模式下運行，而不是嚴苛的原生Wayland模式。 Canonical宣布預設會在Wayland模式下運行Firefox瀏覽器，從而在HiDPI顯示器不會出現介面模糊、縮放失真等問題，並且支援拖曳、手勢捏合等觸控手勢。如上所述，Ubunt

歐洲允許蘋果放鬆瀏覽器限制：可選擇非 WebKit 引擎，Chrome 可作為預設瀏覽器 Jan 26, 2024 am 10:42 AM

1月26日訊息，歐洲地區的iPhone用戶升級iOS17.4Beta1更新之後，打開Safari瀏覽器之後會看到新窗口，支援更換預設瀏覽器。歐洲地區用戶可以根據自己的偏好，設定包括Firefox、Opera、Chrome、Brave和MicrosoftEdge等非Safari瀏覽器了。瀏覽器應用程式現在也可以使用WebKit以外的瀏覽器引擎，包括瀏覽器應用程式和應用程式內的瀏覽體驗。蘋果先前要求包含Chrome瀏覽器和火狐瀏覽器等常用瀏覽器在內，iOS上的所有瀏覽器都必須使用WebKit引擎，今後Chrom

火狐瀏覽器Firefox 115發布，支援Win7/Win8.1的最後一個版本 Mar 04, 2024 pm 04:46 PM

今日最新消息，Mozilla今天正式發布了火狐瀏覽器Firefox115穩定版更新，本次更新最值得關註一點是，這是支援Win7/Win8、macOS10.12、10.13和10.14的最後一個版本。下載網址：https://ftp.mozilla.org/pub/firefox/releases/115.0/Mozilla在官方更新日誌中表示：微軟於2023年1月結束了對Win7和Win8系統的支持，而今天發布的Firefox115版本是上述系統使用者收到的最後一個版本更新。 Win7和Win8用戶

See all articles

css中page-break-after: always;在火狐瀏覽器上不執行的解決方法

熱AI工具

Undresser.AI Undress

AI Clothes Remover

Undress AI Tool

Clothoff.io

Video Face Swap

熱門文章

熱工具

記事本++7.3.1

SublimeText3漢化版

禪工作室 13.0.1

Dreamweaver CS6

SublimeText3 Mac版

熱門話題