links im dokument

robo47 · 27.04.2006, 01:14

dummer titel aber mir fällt grad kein passender begriff ein und zwar geht es um folgendes, habe ich mit css die möglichkeit, dass ein mit

<h2><a name="ankerpunktimdokument">Überschrift</a></h2>

erstellter linkpunkt nicht wie die anderen Links gefärbt wird, ohne dass ich IRGENDWAS am html verändere ? Ich will weder eine spezielle klasse für die anker, noch solch ein konstrukt: <h2><a name="ankerpunktimdokument"></a>Überschrift</h2> wo der Ankerinhalt leer ist, mir würde eine Variante die der Firefox unterstützt reichen, weil es eh mit etwas verbunden werden soll, was nur der FF anzeigt.

mfg
robo47

PaterNoster · 27.04.2006, 09:03

Wenn ich das richtig verstanden habe...

HTML-Code:

<html>
<head>
<title>h2-a-test</title>
<style type="text/css">
<!--
h2 { color:red; }
a { color:blue; }
h2>a { color:yellow; }
-->
</style>
</head>
<body>
<h2>H2 normal</h2>
<a href="#">Link normal</a><br />
<h2><a href="#">Link in H2</a></h2>
</body>
</html>

$traight-$hoota · 27.04.2006, 16:18

ich glaube das problem ist, das nicht nur hyperlinks sondern auch hyperlink-ziele im document hervorgehoben werden.
dazu gibt es ne einfache möglichkeit:

Code:

a{ //a ohne href attribut
 color: black;
 text-decoration: none;
}
a:link{ //a mit href attribut
 color: blue;
 text-decoration: underline;
}

um hovereffekte per a:hover bei linkzielen zu vermeiden, musst du stattdessen die schreibweise a[href]:hover verwenden. das ist zwar eine valide CSS2.0 schreibweise, aber der IE versteht es nicht; dafür wendet er das normale hover aber nur bei links an und aus zwei falschen CSS implementierungen kann man den effekt wiedererlangen, indem man eine extra CSS datei für den IE verwendet.

PaterNoster · 27.04.2006, 16:59

Habe das mal eben getestet, meine Variante funktioniert auch mit

<h2><a name="wasweissichdenn">Anker</a></h2>

robo47 · 27.04.2006, 19:44

also nach viel rumsuchen und allem hab ich wohl gefunden was ich gesucht habe

-> http://robo47.net/public/tests/inter...rnallinks.html

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>h2-a-test</title>
<style type="text/css">
<!--
h2 { color: red; }
a[href] { color: blue; }
a[name] { color: red; }
h2>a { color: yellow; }
-->
</style>
</head>
<body>
<h2>H2 normal</h2>
<h2><a href="#asdf">Link in H2</a></h2>
<h2><a name="test">Link in H2</a></h2>
</body>
</html>

hab rausgefunden in der klammer dahinter kann man alles mögliche angeben, kannte ich bisher irgendwie noch ned so, kann man auch für class benutzen:

Code:

a[class='irgendeineklasse'] { }
a[class~'irgendeineklasse'] { }

hab nämlich im chaos meines schreibtisches die gedruckte version des css-cheat-sheets gefunden
-> http://www.ilovejackdaniels.com/css/css-cheat-sheet/
auf der seite gibts so tolle cheat-sheets auch für php, mysql und JS, wurd glaube ich vor einige zeit mal auf php.de gepostet

$traight-$hoota · 27.04.2006, 19:56

nimm statt a[href] lieber a:link das versteht auch der IE.

Code:

a { color: red; }
a:link { color: blue; }

robo47 · 27.04.2006, 20:18

Zitat:

Zitat von $traight-$hoota

nimm statt a[href] lieber a.link das versteht auch der IE.

Code:

a { color: red; }
a.link { color: blue; }

da das ganze eh am ende mit .before und .after noch sein wird, was der IE eh nicht versteht, isses dann auch egal, wenn ich mich dazu entschließe ein IE-stylesheet zu machen wird das wohl eh ganz anders, ohne nette gimmicks

Lars · 28.04.2006, 14:06

Pseudoklassen werden mit einem Doppelpunkt eingeleitet, der normale Punkt ist für echte Klassen

robo47 · 28.04.2006, 15:49

$traight-$hoota · 28.04.2006, 18:01

er meinte damit mich *g*
wirklich UPS...

korrigiert...

björn · 30.04.2006, 09:30

@straight-shooter: ich glaube er meinte robo, da robo .before geschrieben haben, obwohl pseudoklassen mir :before eingeleitet werden

$traight-$hoota · 30.04.2006, 11:12

ich habttebei :link auch statt nem doppelpunkt nen einfachen punkt geschrieben

björn · 30.04.2006, 16:52

okok, dann trifft es halt auf euch beide zu

robo47 · 30.04.2006, 16:54

sind beide fehlerteufel

b.pwned · 03.05.2006, 19:24

Wie wäre es gaaanz einfach folgendermaßen:
<a href="#bla">Link zum Anker</a>
<h2 id="bla">Hier ist mein Anker</h2>

*edit: der h2 tag muss natürlich auch geschlossen werden mit einem /h2..

robo47 · 03.05.2006, 20:49

problem ist, einige browser unterstützen es via id/bzw ohne <a-tag nicht, hab ich durch zufall irgendwo gelesen, daher hab ich es so gemacht

b.pwned · 03.05.2006, 22:16

Du schreibst im ersten Post, dass es sowieso für den FF gedacht sei. Der kann's jedenfalls.

robo47 · 03.05.2006, 22:17

da gehts mir ja rein ums design, beim rest gehts um die funktion die ich erhalten haben will für alle browser.

ich hab da immer gaaanz komische ansprüche, besonders wenn mir wieder das dumme wort semantik oder so einfällt

Lars · 04.05.2006, 14:33

<a href="#anker">Springen</a>
<a name="anker" />

So ist das gedacht. id="anker" ist nicht vorgesehen.

27.04.2006, 01:14	Nach oben #1
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	links im dokument dummer titel aber mir fällt grad kein passender begriff ein und zwar geht es um folgendes, habe ich mit css die möglichkeit, dass ein mit <h2><a name="ankerpunktimdokument">Überschrift</a></h2> erstellter linkpunkt nicht wie die anderen Links gefärbt wird, ohne dass ich IRGENDWAS am html verändere ? Ich will weder eine spezielle klasse für die anker, noch solch ein konstrukt: <h2><a name="ankerpunktimdokument"></a>Überschrift</h2> wo der Ankerinhalt leer ist, mir würde eine Variante die der Firefox unterstützt reichen, weil es eh mit etwas verbunden werden soll, was nur der FF anzeigt. mfg robo47 __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

27.04.2006, 16:18	Nach oben #3
$traight-$hoota Erfahrener Benutzer Registriert seit: 15.09.2005 Ort: Königreich Flieden Beiträge: 496	ich glaube das problem ist, das nicht nur hyperlinks sondern auch hyperlink-ziele im document hervorgehoben werden. dazu gibt es ne einfache möglichkeit: Code: a{ //a ohne href attribut color: black; text-decoration: none; } a:link{ //a mit href attribut color: blue; text-decoration: underline; } um hovereffekte per a:hover bei linkzielen zu vermeiden, musst du stattdessen die schreibweise a[href]:hover verwenden. das ist zwar eine valide CSS2.0 schreibweise, aber der IE versteht es nicht; dafür wendet er das normale hover aber nur bei links an und aus zwei falschen CSS implementierungen kann man den effekt wiedererlangen, indem man eine extra CSS datei für den IE verwendet. __________________ Weißt Bescheid - Scheiß wie weit

27.04.2006, 16:59	Nach oben #4
PaterNoster Erfahrener Benutzer Registriert seit: 18.08.2005 Ort: Dortmund Beiträge: 166	Habe das mal eben getestet, meine Variante funktioniert auch mit <h2><a name="wasweissichdenn">Anker</a></h2> __________________ wischtisch.de - jetzt auch mit Fotos. Und Senf.

27.04.2006, 19:44	Nach oben #5
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	also nach viel rumsuchen und allem hab ich wohl gefunden was ich gesucht habe -> http://robo47.net/public/tests/inter...rnallinks.html Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>h2-a-test</title> <style type="text/css"> <!-- h2 { color: red; } a[href] { color: blue; } a[name] { color: red; } h2>a { color: yellow; } --> </style> </head> <body> <h2>H2 normal</h2> <h2><a href="#asdf">Link in H2</a></h2> <h2><a name="test">Link in H2</a></h2> </body> </html> hab rausgefunden in der klammer dahinter kann man alles mögliche angeben, kannte ich bisher irgendwie noch ned so, kann man auch für class benutzen: Code: a[class='irgendeineklasse'] { } a[class~'irgendeineklasse'] { } hab nämlich im chaos meines schreibtisches die gedruckte version des css-cheat-sheets gefunden -> http://www.ilovejackdaniels.com/css/css-cheat-sheet/ auf der seite gibts so tolle cheat-sheets auch für php, mysql und JS, wurd glaube ich vor einige zeit mal auf php.de gepostet __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

27.04.2006, 19:56	Nach oben #6
$traight-$hoota Erfahrener Benutzer Registriert seit: 15.09.2005 Ort: Königreich Flieden Beiträge: 496	nimm statt a[href] lieber a:link das versteht auch der IE. Code: a { color: red; } a:link { color: blue; } __________________ Weißt Bescheid - Scheiß wie weit Geändert von $traight-$hoota (28.04.2006 um 18:26 Uhr).

28.04.2006, 14:06	Nach oben #8
Lars me pro ok? Registriert seit: 07.09.2005 Ort: Pulheim bei Köln Beiträge: 964	Pseudoklassen werden mit einem Doppelpunkt eingeleitet, der normale Punkt ist für echte Klassen __________________ Gedanken aus Draht stricken einen Zaun.

28.04.2006, 15:49	Nach oben #9
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	ups __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

28.04.2006, 18:01	Nach oben #10
$traight-$hoota Erfahrener Benutzer Registriert seit: 15.09.2005 Ort: Königreich Flieden Beiträge: 496	er meinte damit mich g wirklich UPS... korrigiert... __________________ Weißt Bescheid - Scheiß wie weit Geändert von $traight-$hoota (28.04.2006 um 18:27 Uhr).

30.04.2006, 09:30	Nach oben #11
björn Benutzer Registriert seit: 31.12.2005 Beiträge: 90	@straight-shooter: ich glaube er meinte robo, da robo .before geschrieben haben, obwohl pseudoklassen mir :before eingeleitet werden

30.04.2006, 11:12	Nach oben #12
$traight-$hoota Erfahrener Benutzer Registriert seit: 15.09.2005 Ort: Königreich Flieden Beiträge: 496	ich habttebei :link auch statt nem doppelpunkt nen einfachen punkt geschrieben __________________ Weißt Bescheid - Scheiß wie weit

30.04.2006, 16:52	Nach oben #13
björn Benutzer Registriert seit: 31.12.2005 Beiträge: 90	okok, dann trifft es halt auf euch beide zu

30.04.2006, 16:54	Nach oben #14
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	sind beide fehlerteufel __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

03.05.2006, 19:24	Nach oben #15
b.pwned Neuer Benutzer Registriert seit: 12.11.2005 Beiträge: 5	Wie wäre es gaaanz einfach folgendermaßen: <a href="#bla">Link zum Anker</a> <h2 id="bla">Hier ist mein Anker</h2> edit: der h2 tag muss natürlich auch geschlossen werden mit einem /h2.. Geändert von b.pwned (03.05.2006 um 19:37 Uhr).*

03.05.2006, 20:49	Nach oben #16
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	problem ist, einige browser unterstützen es via id/bzw ohne <a-tag nicht, hab ich durch zufall irgendwo gelesen, daher hab ich es so gemacht __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

03.05.2006, 22:16	Nach oben #17
b.pwned Neuer Benutzer Registriert seit: 12.11.2005 Beiträge: 5	Du schreibst im ersten Post, dass es sowieso für den FF gedacht sei. Der kann's jedenfalls.

03.05.2006, 22:17	Nach oben #18
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184	da gehts mir ja rein ums design, beim rest gehts um die funktion die ich erhalten haben will für alle browser. ich hab da immer gaaanz komische ansprüche, besonders wenn mir wieder das dumme wort semantik oder so einfällt __________________ - Onlinetools - Mein Blog endlich mit RSS-Feed

04.05.2006, 14:33	Nach oben #19
Lars me pro ok? Registriert seit: 07.09.2005 Ort: Pulheim bei Köln Beiträge: 964	<a href="#anker">Springen</a> <a name="anker" /> So ist das gedacht. id="anker" ist nicht vorgesehen. __________________ Gedanken aus Draht stricken einen Zaun.

04.05.2006, 15:09	Nach oben #20
robo47 BIN EIN KRASSA HELD!!!111 Registriert seit: 02.06.2005 Ort: weiher im tiefsten Odenwald Beiträge: 1.184