Verweise, die auf Sprungziele zeigen, ansprechen
Tomas
- css
0 Axel Richter0 Axel Richter0 Tomas
0 Gunnar Bittersmann0 Tomas0 Gunnar Bittersmann0 Tomas
Hallo liebe Forengemeinschaft,
für ein Druckstylesheet wollte ich Verweise, die auf ein Ziel innerhalb der Seite zeigen (<a href="#druck"> springt zu<h3 id="druck">
) so formatieren, dass sie vom normalen Text nicht unterscheidbar sind.
Das bedeutet unter anderem, Erweiterungen von normalen Verweisen, die von :before und content: stammen wieder zu entfernen.
Dazu habe ich Versucht die Angabe a[href|=#]
zu verwenden, aber weder diese, noch die Form mit der Tilde, noch der ausgeschriebene Name der ID sprechen das Element überhaupt an.
Der relevante CSS Auszug:
a { text-decoration: none; }
a:after {
content: ' (' attr(href) ')';
}
a[href|=#]:after {
content: ' ';
}
Ich kann mir vorstellen, dass das Gatterzeichen problematisch ist, da es in CSS eine andere Bedeutung hat. Ist es also nicht möglich, Sprungverweise anzusprechen?
Verzweifelt, Tomas
Hallo,
a[href|=#]:after
Das geht so nicht (siehe JavaScript-Konsole im FireFox). Man kann aber die Value in Anführungszeichen setzen:
a[href|="#"]:after
Das würde auf
<a href="#-test" ...>
passen, wobei test beliebig sein kann. Passt, wenn der Attributwert (hier der von href) eine mit Bindestrich getrennte Liste von Worten ist, welche mit dem angegebenen Wert (hier "#") beginnt.
viele Grüße
Axel
Hallo,
a[href|="#"]:after
Das würde auf
<a href="#-test" ...>
passen, wobei test beliebig sein kann.
Wenn mit <a href="#-test" ...> eine id="-test" referenziert werden soll, dann ist das so nicht richtig, weil IDs mit einem Buchstaben beginnen müssen. Dann müsste es also z.B. so:
a[href|="#A"]:after
<a href="#A-test" ...>
<p id="A-test" ...>
aussehen.
viele Grüße
Axel
Hallo,
Hallo!
a[href|="#A"]:after
<a href="#A-test" ...>
<p id="A-test" ...>
viele Grüße
Vielen Dank, es funktioniert. Das mit dem Bindestrich hatte ich wohl irgendwie nicht überrissen.
Gruss, Tomas
Hello out there!
Ich kann mir vorstellen, dass das Gatterzeichen problematisch ist, da es in CSS eine andere Bedeutung hat.
Das ist nicht das Problem, sondern dass es in CSS 2 keine substring matching attribute selectors gibt. Diese werden erst mit CSS 3 eingeführt [CSS3-SELECTORS § 6.3.2]
Ist es also nicht möglich, Sprungverweise anzusprechen?
Mit CSS 2 nein. Inwieweit Browser schon die erweiterten Möglichkeiten von CSS 3 implementiert haben, müsstest du ausprobieren.
Ansonsten bleibt dir nur, im HTML-Quelttext Klassen zu vergeben.
See ya up the road,
Gunnar
Hello out there!
Hallo!
Mit CSS 2 nein. Inwieweit Browser schon die erweiterten Möglichkeiten von CSS 3 implementiert haben, müsstest du ausprobieren.
Anscheinend geht es doch, habe wohl etwas ungenau gelesen :-(
Aber trotzdem vielen Dank für den Hinweis, das ist in zuklunft sicher nützlich :-)
Gruss, Tomas
Hello out there!
Ansonsten bleibt dir nur, im HTML-Quelttext Klassen zu vergeben.
Was natürlich auch ein JavaScript übernehmen kann, was onload aufgerufen alle Links abklappert und ja nach href-Attributwert klassifiziert. Für die Bildschirmanzeige wäre das unschön, da nochmals gerendert wird, aber für die Druckausgabe brauchbar.
Ansonsten kann die Aufgabe auch XSLT übernehmen (server- oder clientseitig), wenn das Dokument in XHTML geschrieben ist. Oder natürlich PHP.
See ya up the road,
Gunnar
Hallo nochmal,
Ansonsten bleibt dir nur, im HTML-Quelttext Klassen zu vergeben.
Was natürlich auch ein JavaScript übernehmen kann, was onload aufgerufen alle Links abklappert und ja nach href-Attributwert klassifiziert. Für die Bildschirmanzeige wäre das unschön, da nochmals gerendert wird, aber für die Druckausgabe brauchbar.
Ich verzichte lieber auf JavaScript, wenn es nicht unbedingt notwendig ist.
Ansonsten kann die Aufgabe auch XSLT übernehmen (server- oder clientseitig), wenn das Dokument in XHTML geschrieben ist. Oder natürlich PHP.
Das ist sicher eine gute Idee, wie ich festgestellt habe, interpretiert Opera die von Axel genannte Methode nicht, vermutlich, weil Sprungziele dort (zumindest in meinem 8.54) zusammen mit der URI ausgegeben werden.
Ich verwende XHTML und PHP von daher wird sich schon eine Lösung finden :-)
Gruss, Tomas
Hello out there!
Was natürlich auch ein JavaScript übernehmen kann, was onload aufgerufen alle Links abklappert […]
... was mit der http://de.selfhtml.org/javascript/objekte/links.htm@title=links-Collection auch recht einfach geht.
Ich verzichte lieber auf JavaScript, wenn es nicht unbedingt notwendig ist.
Ich halte JavaScript hier durchaus für unobtrusive und vertretbar. Für Nutzer ohne JavaScript sieht der Ausdruck halt anders aus, ist ja aber dennoch zu gebrauchen.
See ya up the road,
Gunnar
Hallo, etwas verspätet
... was mit der http://de.selfhtml.org/javascript/objekte/links.htm@title=links-Collection auch recht einfach geht.
Das werde ich mir genauer ansehen, danke.
Ich halte JavaScript hier durchaus für unobtrusive und vertretbar. Für Nutzer ohne JavaScript sieht der Ausdruck halt anders aus, ist ja aber dennoch zu gebrauchen.
Ja das stimmt, es wird halt zusätzlich der Verweis angezeigt, aber sonst kein Unterschied.
Danke, Tomas