打印樣式表故障

Question

首先，我承認我對HTML和CSS的知識非常有限。我很驚訝，我能夠首先創建一個網站。

在我的搜索引擎優化工作中，我意識到我需要一個適合我的網站的打印版本。我已經能夠隱藏我不想打印的元素（圖片，臉譜/ pinterest /博客按鈕等），但我無法通過兩件事。

1. 我希望我的標誌/標題在可打印頁面上小得多。

2. 我無法擺脫我的導航（邊欄）佔據左側的空間。顯然，僅僅隱藏它是不夠的？

我的網站是www.minnesotamarryingman.com，如果你把它打印出來，你可以看到大高於需求，是頭和左側大量列。

這裏是我有我的print.css ...

#header {width:128; height:29;} 

#body {margin:0; padding:0; float: none; line-height: 1.4em; word-spacing:1px; letter-spacing:0.2px; font: 16px Arial, Helvetica,"Lucida Grande", serif; color: #000;} 

div#sidebar{display: none} 

div#pinterest{display: none} 

div#pinterest1{display: none} 

div#facebook{display: none} 

div#blog{display: none} 

div#picture1{display: none} 

div#picture2{display: none} 

div#list{display: none} 

可有人請幫我看看，我要去哪裏錯了嗎？

Answer 1

它在我的MacBook Pro上在Chrome和Safari上實際上看起來相當不錯，所以我猜你猜出了左邊的Navbar問題。爲了使標識更小，我只需在標識圖像中加入一個id標籤，然後在print.css中設置它，而不是爲標題設置一個新的高度和寬度。此外，說出大小的單位很重要，所以請在數字後面使用'px'，如下所示！

在您的文件：

<img src="....." id="logo"> 

而在你打印的CSS：

#logo { width:128px; height:29px; }