資料結構
網路
關係資料庫管理系統 (RDBMS)
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究Internet Explorer 8 不會修改列印樣式表中的 HTML5 標籤
在製作列印樣式表時，您需要各種 HTML5 標籤，例如 <nav>、<article>、<div>、<section> 等，這些標籤用於網頁的不同佈局選項，這些選項將被列印。
Chrome、Firefox 和 Internet Explorer 9 使使用者能夠在其瀏覽器中使用此類 HTML5 標籤。但是，Internet Explorer 6-8、Safari 4x 和其他此類舊版瀏覽器不支援這些標籤，因此我們無法在網頁中應用這些佈局選項。
那麼，我們如何在 Internet Explorer 8 中使用這些 HTML5 標籤呢？為此，您可以使用 **html5.shiv**。
首先讓我們瞭解列印樣式表。
什麼是列印樣式表？
樣式表是一組程式碼，它告訴瀏覽器網頁的外觀，例如大小、字型、佈局、縮排、間距等。
列印樣式表用於以有組織的方式格式化要列印在紙張上的網頁。
在 CSS 中，我們有 `@media` print，它用於格式化要列印的頁面。
示例
@media print { body {font-size: 12pt}; header {display: none}; footer {display: none}; margin: 2cm; width: 100%; }
如何建立列印 CSS？
在為要列印的頁面設定樣式時，您應該記住以下幾點：
定義邊框和字型大小
首先，您應該為頁面新增邊距。
示例
<img src = “example.jpg” onload = “load()” width= “220” height= “300”> page { width: 100%; margin: 3cm; }
突出顯示連結
由於無法在紙張上單擊連結，因此您應該突出顯示它。
示例
a: link { background: transparent; font-color: blue; text- decoration: underline; }
隱藏影片和音訊
由於無法在紙張上顯示影片和音訊，因此頁面上會出現不合適的空白。因此，您應該隱藏影片和音訊。
示例
.video { display: none; width: 0 !important; height: 0 !important; overflow: hidden !important; }
**注意** － !important 是 CSS 的規則，它賦予屬性更高的重要性。如果您使用 !important
規則，則它會覆蓋該元素上該屬性的所有先前樣式程式碼。
隱藏其他不需要的元素
網頁的許多區域不需要列印。因此，您應該隱藏這些區域。這可以使用 `display: none;` 來完成。
示例
nav, button { display: none; }
html5shiv 和 printshiv 用於基本樣式
讓我們瞭解 htmlshiv 和 printshiv 如何用於樣式表。
html5shiv
html5shiv 是針對 Internet Explorer 6 – 8、Safari 4.x 和 Firefox 3.x 的 Javascript shim，它使這些瀏覽器能夠支援新的 HTML5 樣式元素。
它用於為上述瀏覽器使用 `document.createElement` 建立元素。它具有 `print.shiv`，它使 HTML5 元素在 IE 6-9 中列印時能夠進行格式化。
注意
它位於 <head> 標籤內
因為它是一個 Javascript shim，所以它寫在 <script> 標籤下
示例
<html> <head> <title> Print stylesheet example </title> <script src = “/js/html5.shiv.js> </script> </head> <body> <section> <h2> This is an example </h2> <p> text to be entered in the section </p> <section> </body> </html>
printshiv
htmlshiv-printshiv.js 是一段程式碼，它使要在低於 9 版本的 Internet Explorer 中列印的網頁中的 HTML5 元素能夠設定樣式。
示例
<head> < script src = “/js/html5shiv-printshiv.js”> </script> </head>
替代方法
您還可以使用 **onbeforeprint** 和 **onafterprint** 事件來實現這一點。
**onbeforeprint** 事件在頁面即將列印時發生，即在列印對話框出現之前。
**onafterprint** 事件在頁面正在列印過程中發生，即列印對話方塊關閉之後。
語法
In HTML, < element onbeforeprint = “yourCode”>
In Javascript, object.onbeforeprint = function() { code} ;
示例
假設您想在列印網頁之前隱藏網頁中存在的影片，則可以編寫以下程式碼：
<body> <video onbeforeprint = “example”> </video> <script> function example() { document.getElementById( “video”).style.display = “none”; } </script> </body>
結論
儘管更新版本的 Internet Explorer、Firefox 和 Safari 確實具有各種功能，使使用者能夠設定要列印的頁面的樣式，但舊版本，如 Internet Explorer 6-9、Safari 4x 等，不支援此類 HTML5 元素來格式化頁面。為了使瀏覽器讀取這些程式碼，您可以使用 Javascript 的 **html5.shiv** 和 **onbeforeprint** 事件。
瀏覽量 198 次
