iT邦幫忙

0

以css中的{display:none}設定(隱藏)列印範圍,在ie6無解?..

  • 分享至 

  • xImage

網頁設計中,為了設定列印範圍,而將不想呈現及列印出來的部份用{display:none}隱藏div區塊內容,這在ie8正常,ie6無效,爬了很多文都找不到解決的辦法,請問有對應之css hack可解決此問題?問題原始碼參考如下:

<meta http-equiv="Content-Type" content="text/html; charset=big5">
<style>
#JustPrint {display:none}
@media print {
#JustPrint { display:block; font:9pt verdana; letter-spacing:2px;}
#NoPrint {display:none}
}
</style>

<span id="NoPrint"><input type="button" value="Print" onClick="window.print()"><br></span>
[Print]按鈕,看得到,但印不到<br>
這裡是本文區,看得到,也印得到
<span id="JustPrint">這裡是LOGO,看不到,但印得到</span>

圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 個回答

6
wordsmith
iT邦高手 1 級 ‧ 2010-04-07 11:48:02
最佳解答

由於我的IE 6用的是MultipleIEs的版本,列印預覽和列印好像都不管用,所以沒有辦法實測display:none的bug。

不過有一個歪招,應該可以達到你要的效果。

&lt;pre class="c" name="code">&lt;style> 
#JustPrint {display:none;_margin-left:-9999px} 
@media print { 
#JustPrint { display:block; font:9pt verdana; letter-spacing:2px;_margin-left:0} 
#NoPrint {display:none;_margin-left:-9999px} 
} 
&lt;/style> 

這招是利用ie 6 css hack的方法,利用_margin-left將不想顯示的物件拉到-9999px的地方,這樣子列印時就不會出現。你可以試試在IE 6上管不管用,記得margin前一定要加上一條底線,那是讓ie 6認的。

tse1218 iT邦新手 5 級 ‧ 2010-04-07 14:01:24 檢舉

謝謝您提供的方法
剛剛試過了
很遺憾的是..ie6依然無效...

tse1218 iT邦新手 5 級 ‧ 2010-04-12 18:00:09 檢舉

謝謝大家的解答
我終於找出問題了
問題不在display:none
但之前怎麼試都試不出來
原因卻是在編碼的語系問題
我的php在寫的時候設定用big5
但因為css是用匯入的
居然沒注意到css是設成utf-8編碼...
只要把css檔的編碼也改成一樣就行了
就這樣人仰馬翻了好一陣子
還浪費了大家寶貴的時間
真是不好意思...
誤導了大家
小弟在此向各位致上最深的歉意和感謝~~

4
jokera
iT邦新手 3 級 ‧ 2010-04-07 16:39:45

結論是:
class=xxxx
不是id=xxxx

tse1218 iT邦新手 5 級 ‧ 2010-04-07 20:15:02 檢舉

在測試的時候
就已經有把id改成class了
.NoPrint {display:none;}
<span class="NoPrint">
.....
可是結果還是一樣...

我要發表回答

立即登入回答