極客狂言：為什麼這麼多網站沒有使用列印樣式表？
人們不得不在網頁上尋找一個連結或一個按鈕，上面寫著“列印”，這一點讓我一直感到驚訝，尤其是考慮到有一種神奇的技術使得這一步變得不必要。可悲的是，幾乎沒有人用它，即使它已經…10歲了。
不僅需要額外的列印步驟是愚蠢的，而且使用列印樣式表可以為不使用可列印連結的任何人節省一些墨水。當然，也有很多人使用print-to-PDF來儲存文章以備日後使用，而不會浪費紙張。
什麼是列印樣式表(print stylesheets)？
大多數網站實現列印功能時都會將您轉到另一個頁面，印表機的格式會有所不同，但這並不是必須的。每個瀏覽器都實現一種簡單的CSS技術，稱為列印樣式表，它只不過是一個檔案，指定瀏覽器列印頁面時要隱藏的元素。
對於那些不熟悉CSS的人來說，CSS意味著層疊樣式表，它是你的瀏覽器知道如何將網頁的HTML原始碼格式化成你在螢幕上看到的內容的方式。從字型、顏色、邊框，甚至是背景影象都可以在樣式表中指定。
新增列印樣式表非常簡單，只需將這一行**HTML頁面。程式碼的media=print部分告訴瀏覽器在列印時只使用此樣式表。
<link rel=”stylesheet” href=”print.css” type=”text/css” media=”print” >
此檔案通常如下所示：
#sidebar, #footer, #navigation, #sharinglinks, #topad, #comments { display:none }
是的，就這麼簡單。那麼它是如何工作的呢？在左邊是一個普通網頁的例子，所有的導航、logo和廣告都清晰可見，並帶有相關的ID，在右邊是應用了列印樣式表的同一個頁面，隱藏了所有這些元素。
很明顯你更喜歡把一個印在另一個上面，對吧？
列印樣式表失敗的示例
不幸的是，有大量的大型網站根本就不想實現這一點。看看當你試圖從《****》刊登文章時會發生什麼：
有些網站，如Gawker網站網路，甚至更糟。它們不僅沒有可列印的檢視，而且當您嘗試列印時，它就像墨水湯。據我們所知，如果不使用獨立的服務（如可讀性）或手動突出顯示頁面上的內容（這在他們的新設計中幾乎是不可能的），就無法從Gawker網站列印。
真的很難過。大網站的負載完全沒有實現這個功能。
謝天謝地，有些網站確實使用了它們
下面是一個格式正確的可列印檢視的示例—無需費心尋找一些列印連結。英國廣播公司的新聞網站整齊地格式化了文章的列印格式，並配有一個定製的標題。它們確實在print檢視中包含註釋，但這仍然是一項很好的工作。
有相當多的其他網站，做同樣的，像阿斯特尼卡和…我們的網站，但這將是愚蠢的，顯示所有的截圖。在我們的研究中，正確實現它們的站點很少。
所以總結一下…請花5分鐘為你的網站實現一個列印樣式表！
- 發表於 2021-04-12 23:31
- 閱讀 ( 33 )
- 分類：網際網路
你可能感興趣的文章
為學生和宿舍提供20個很棒的3d列印創意
... 如果你是一個技術極客，那麼你可能有幾十個USB驅動器和SD卡躺在周圍。把它們整理得井井有條是很困難的，你寧願把它們都扔進一個抽屜裡——但要在一堆亂七八糟的東西中找到一個是不...
9個網站實際上並不糟糕
... 主頁非常簡單。沒有什麼比普通的個人資料網站更好的了。儘管它是建立在Weebly的拖放平臺上的，但它還是作為一個不錯的網站通過了審查。gallery頁面提供了與Pix Fix相同的有趣的照片縮放彈...
11 css模板網站：不要從頭開始！
...也超級流行。大多數已經被下載了數十萬次，很容易理解為什麼。 ...
建立web介面：從何處開始
... 你為什麼需要它 ...
最好的引文和書目工具，寫一篇更好的研究論文
... Dann寫了一篇關於什麼是引文，它們是如何工作的，以及為什麼需要使用它們的一般性文章。下面是最常見的樣式的快速入門，它們來自哪裡，以及它們之間的區別。引文樣本是針對書籍的，但每個來源的引文系統都是相似的。...
如何用wget將多個網頁轉換成pdf
... 為什麼是wget？ ...
什麼是xml檔案？如何開啟和使用它？
...HTML定義了資料的外觀，而XML定義了資料是什麼。這就是為什麼XML不能取代HTML，而是擴充套件了它。 ...
什麼是wordpress開發者？5種必備技能
... 但是WordPress開發者到底做什麼呢？繼續讀下去，瞭解這份工作需要什麼，以及你需要什麼技能才能成功。 ...
使用css格式化文件以便列印
... 這將有助於防止表跨越多個頁面，前提是沒有一個頁面比一個頁面高。類似地： ...
瀏覽器給網站帶來了自動暗模式
...援prefers配色方案几個星期。 太新了。您可能不會遇到許多網站使用首選配色方案自動啟用暗模式尚未。 這在未來將有望改變。網站現在可以尊重你的黑暗模式偏好，並自動遵循它。Web開發人員有一個新的選擇，他們可以利用。...
