2011-06-06 122 views
4

我正在創建一個打印樣式表,我想通過在鏈接和圖像旁邊顯示鏈接URL來儘可能地訪問該網站。CSS打印預覽 - 顯示圖像/鏈接URL

對於簡單的鏈接,我發現這個解決方案:

http://davidwalsh.name/optimize-your-links-for-print-using-css-show-url

a:link:after, a:visited:after { content:" [" attr(href) "] "; } 

和它的作品。但對於圖像鏈接,這將「漂浮」圖像旁邊的內容屬性的文本和整個佈局混亂...

所以有一種方法來顯示圖像上方的URL文本,在頂部左角?或者可能低於圖片...

回答

1

這真的取決於您的網站佈局。例如,如果您將display:block設置爲圖片和:after內容,則鏈接網址將顯示在圖片下方。當然這可能會破壞你的佈局。

我懷疑你最終可能會在特定區域使用很多不同的聲明。由於您可以將幾乎任何樣式應用於附加的網址(包括定位),因此您應該可以根據具體情況解決此問題。

如果您發現您需要特定圖片/地區的幫助,請發佈一個示例或圖片以幫助我們一起!

HTH :)