2012-01-17 72 views
3

我有一個從CSS精靈這樣加載兩個圖像的網頁:打印圖像從css sprite加載?

<html> 
<head> 
    <link rel="stylesheet" type="text/css" href="stylesheet.css"> 
</head> 
<body> 
    <div class="arrow low"></div> 
    <div class="arrow high"></div> 
</body> 
</html> 

和CSS(stylesheet.css中)看起來是這樣的:

.arrow 
{ 
    height: 239px; 
    width: 260px; 
    background: url('logotypearrows.png') no-repeat; 
} 

.arrow.high 
{ 
    background-position: 10px 0px; 
} 

.arrow.low 
{ 
    background-position: -1003px 0px; 
} 

的網頁看起來很完美,但我無法打印它。我看不到動態加載的箭頭。任何人都知道如何解決這個問題?我希望能夠打印出箭頭,並且我想從css精靈中加載它們。

回答

3

默認瀏覽器不打印背景圖像,這可以由用戶更改。 也許您應該在div <div class="arrow low"><span class="print-only">*</span></div>內部添加一些內容,並且僅使用@media print的網頁的打印版本才能看到它。

0

在哪張圖片您必須打印?

0

這取決於用戶和他們的瀏覽器設置打印或不打印 背景圖像。爲了避免依賴於此,請將 圖像放在HTML中的前景中。 - Kon

(從這個related thread拍攝)