CSS: URL von Links drucken, aber nicht bei Bildern

Monk Gast #7565539
Lesenswert?
• ▲
▼

Wenn man meine Homepage ausdruckt, sollen die URLs von den meisten Links sichtbar sein. Etwa so:

Siehe detaillierte Anleitung (http://irgendwo.de/anleitungen/12345.html)

Dazu verwende ich diesen Style:

1
 
@media only print {

2
 
    a:link:after, a:visited:after {

3
 
       content:" (" attr(href) ") ";

4
 
       font-weight:bold;

5
 
    }

6
 
}

Jetzt habe ich aber auch eine Menge eingebettete Bilder, die man durch Anklicken vergrößern kann, bei denen die URL auf dem Papiert nutzlos wäre:

1
 
<a href ="platine.jpg"><img src="platine.jpg" style="width:10em"></a>

Wie kann ich dafür sorgen, dass die URL bei solchen Bildern nicht ausgedruckt wird?

Zur Zeit habe ich allen betroffenen Bildern einen eigenen Style "noPrintLinks" zugewiesen, aber lieber wäre mir eine zentral automatische Lösung die ohne extra Code in sämtlichen HTML Dateien auskommt.

Antwort Zitieren Bearbeiten Thread verschieben Thread sperren Anmeldepflicht aktivieren Anpinnen Thread löschen Thread mit anderem zusammenführen Beitrag melden
Beitrag #7565748 wurde von einem Moderator gelöscht.
Ralf D. #7566219
Lesenswert?
• ▲
▼

Steve van de Grens schrieb:

Ich habe eine Lösung gefunden, klappt aber leider nicht im Firefox.

1
 
> @media only print {

2
 
> 

3
 
>     a:after, a:after {

4
 
>         content:" (" attr(href) ") ";

5
 
>     }

6
 
> 

7
 
>     a:has(> img):after {

8
 
>         content:"";

9
 
>     }

10
 
> }

11
 
>

Ich würde mal die Spezifizität erhöhen. Ein "!important" ginge theoretisch zwar auch - aber ich hasse es zur Atombombe zu greifen. ;-)

1
 
@media only print {

2
 


3
 
    a:link:after, a:visited:after {

4
 
        content:" (" attr(href) ") ";

5
 
    }

6
 


7
 
    a:link:has(> img):after, a:visited:has(> img):after {

8
 
        content:"";

9
 
    }

10
 
}
Antwort Zitieren Bearbeiten Löschen Beitrag melden
Monk Gast #7567905
Lesenswert?
• ▲
▼

Ich habe gelesen, dass Firefox Version 121 den "has()" Selektor unterstützt. Wenn das wirklich stimmt, dann kann es ja so bleiben:

1
 
@media only print {

2
 
    a:after {

3
 
        content:" (" attr(href) ") ";

4
 
    }

5
 


6
 
    a:has(> img):after {

7
 
        content:"";

8
 
    }

9
 
}

Mal sehen, wann diese Version bei Debian (stable) kommt.

Antwort Zitieren Bearbeiten Löschen Beitrag melden
Thread beobachten

Antwort schreiben

Bitte melde dich an, um einen Beitrag zu schreiben.

Bestehender Account

oder

Mit Google-Account einloggen

Noch kein Account?

Die Registrierung ist kostenlos und dauert nur eine Minute.

Jetzt registrieren