css MouseOver geht nicht

Tobias4 · 6. Mai 2008 um 18:46

Hallo, hab per CSS u.a. ein MouseOver eingebaut. Also, underline und so geht, aber die Farben für active, visited, link gehen einfach nicht. der Link bleibt einfach schwarz. Was soll ich machen? Ich habe auch nicht im HTML Dokument den Link per font oder style=„color“ schwarz eingefärbt. Im HTML-Dokument ist keine Farbe angegeben. Wieso wird die Farbe nicht verändert? Also beim hover klappts aber sonst net

PS: unter dem Befehl A:link wird gar nichts wahrgenommen. Es wird nur A:Hover wahrgenommen. Dort werden Änderungen (zB underline, Farbe ändern) sichtbar.

assmaje · 6. Mai 2008 um 19:00

[SIZE=„1“]sucht
nicht findet[/SIZE]

Wo ist dein Code?

Tobias4 · 6. Mai 2008 um 19:18

[code]a:link { color: #0000FF; font-size: 9pt; font-family: Verdana; text-decoration: none }
a:active { color: #000000; font-size: 9pt; font-family: Verdana; text-decoration: none }
a:visited { color: #000000; font-size: 9pt; font-family: Verdana; text-decoration: none }
a:hover { color: #000000; font-size: 9pt; font-family: Verdana; text-decoration: underline }

.name { color: #000000; font-size: 11px; line-height: 12pt; font-family: Verdana }

.title { color: #000000; font-weight: bolder; font-size: 12pt; line-height: 18pt; font-family: Verdana }[/code]

dying_hero · 6. Mai 2008 um 19:27

Ich würde vielleicht noch das a:link einfach als a machen, dass dann als standard gilt und mit a:hover, a:active und a:visited nur die veränderten eigenschaften überschreiben.

Ich gehe wohl recht in der Annahme, dass du deinem Link keine Klasse zugewiesen hast;)

Der Code sieht sonst ganz ok aus…

assmaje · 6. Mai 2008 um 19:29

#000000 ist der Code für schwarz und #0000FF wird wahrscheinlich sehr ähnlich sein. Deshalb sehen deine Links schwarz aus.
Übrigens hast du focus vergessen:

a:link { color:#000000; text-decoration:underline; } a:visited { color:#000000; text-decoration:underline; } a:focus { color:#000000; text-decoration:underline; } a:hover { color:#FF8C00; text-decoration:underline; } a:active { color:#FF8C00; text-decoration:underline; }

Eine Liste aller Web-Farben (benutze immer nur die Farbcodes, nicht die Namen): Farbtabelle

system · 6. Mai 2008 um 19:33

???

das ist knackeblau…

kleine farbenkunde am rande

RGB rot-grün-blau…00(kein rot)…00(kein Grün)…FF(voll Blau)

Tobias4 · 6. Mai 2008 um 19:37

lol, wollte ich auch grad sagen ^^ 0000FF is blau
werde mal testen den code

assmaje · 6. Mai 2008 um 19:38

Hups, hab nicht nachgesehn… :razz:

@Tobias4:
Nimm meinen Code (setz deine Farben etc. ein) und kopier ihn in dein Style-Sheet, also NICHT im -Bereich deiner Webseite.

Icy · 6. Mai 2008 um 19:40

Wo ist jetzt genau der Unterschied (vom Ergebnis her), ob er es in eine Stylesheet-Datei oder in den Head Bereich zwischen style-Tags schreibt? ^^

MfG Icy

Tobias4 · 6. Mai 2008 um 19:41

Naja, geht net richtig. code von assmaje.
beim klick wird ganz kurz die farbe bei hover angezeigt. a:link farbe blau wird nicht angezeigt. nach wie vor schwarz. =(

E D I T :
Hover, active und so geht, a:link leider nicht. wird nur schwarz angezeigt. nicht meine eingestellten farben und formatierungen. Was war das mit der Link-Klasse???

Maxi · 6. Mai 2008 um 19:48

Ich verschiebs mal in den CSS-Bereich rüber…

neuroleptika · 6. Mai 2008 um 19:49

So ist es erstmal auf aufs nötigste gekürzt:

[code]
a {
color: #0000FF;
font-size: 9pt;
font-family: Verdana; text-decoration: none;
}

a:active {
color: #000000;
text-decoration: none;
}

a:visited {
color: #000000;
text-decoration: none;
}

a:hover {
color: #000000;
text-decoration: underline;
}
[/code]Bedenke, dass du durch das Rumprobieren im Browser vermutlich schon alle Links angeklickt wurden. Deswegen wird visited immer eintreffen.
Entweder du löscht nach jeder Änderung den Cache oder du deaktivierst den Cache im Browser.

Oder du lässt a:visited zum testen erst mal weg.

(Besser du gibst auch :focus mit an)

assmaje · 6. Mai 2008 um 19:51

CSS - nämlich Cascading-[U]Style-Sheet/U - macht man ins Style-Sheet (klingt einleuchtend, oder?). Die HTML-Datei sollte möglichst nur reinen HTML-Code enthalten. HTML dient zum Strukturieren, CSS zum Designen. So hat man immer einen klaren Überblick über seine Webseite. Für größere Webseiten ist das dringend notwendig.

Tobias4 · 6. Mai 2008 um 19:51

visited ist mir eh egal ^^ brauch ja kein mensch. werde das mal testen.

E D I T:
Nein, geht nicht. Hover geht, sonst nichts. =(

Naja, dann belassen wir es einfach bei hover ^^
Noch eine Frage: Was füge ich in die css Datei ein, damit die komplette Textseite die Schriftart Verdana und Größe 9pt bekommt?

neuroleptika · 6. Mai 2008 um 19:59

body {
font-size: 9pt;
font-family: verdana;
}

Schriftgrößen würde ich nur zum printen in pt angeben.
Ich verwende meistens em.

Über den Sinn von visited kann mann geteilter Meinung sein.
:activ und :focus sind aber schon eine Hilfe.

Icy · 6. Mai 2008 um 20:35

Klar sollte man HTML und CSS voneinander trennen, das heißt aber nicht dass man CSS direkt aus der kompletten Datei verbannen muss.
Der style-Bereich im head ist für CSS geeignet und da vermischt du auch kein HTML mit CSS. Ich würde zB auch nicht für jede Auszeichnung extra eine CSS-Datei anlegen.
Was ich sagen will: Es ist völlig egal ob man CSS in einer extra Datei oder im Headbereich nutzt, auch wnen ich persönlich die erste Variante aus anderen Gründen bevorzuge

Ich hoffe mein kleiner OT-Text geht in Ordnung ^^

MfG Icy

assmaje · 6. Mai 2008 um 20:44

Ich auch nicht. Es gibt nur eine CSS-Datei.
Egal, ich erkläre dieses Thema hiermit für abgeschlossen…

Tobias4 · 6. Mai 2008 um 21:19

Was ist denn a:focus?
mfg Tobi
PS: habe wie einer von euch sagte mal visited gelöscht und siehe an es geht =) Ich dussel! Vielen Dank!

neuroleptika · 6. Mai 2008 um 21:30

a:focus spricht durch die Auswahl mit der Tabtaste an.
Internet Explorer kennen :focus nicht, wenden aber :activ wie :focus an.
Deshalb ist es besser beides anzugeben.
activ ist für die Maus-Bedienung gedacht und :focus für die Tabtaste.

Opera geht da einen ganz eigenen Weg (den ich nicht weiter kenne).

system · 7. Mai 2008 um 05:47

:visited ist ein wichtiges Element in Sachen Usability. Man sollte besuchte Links unbedingt kennzeichnen, damit der Nutzer weiß, dass er die Seite schon besucht hat.

Doch. Das ist mit Sicherheit die beste Lösung!

Style-Angaben im Head blähen die HTML-Datei unnötig auf und erhöhen so die Ladezeiten. Schreibt man alles in ein oder mehrere Stylesheets, bleibt jedes Stylesheet im Cache und wird nur einmal geladen.
„Trennung von Inhalt und Layout“ - Schon aus Prinzip würde ich es trennen, es ist einfach sauberer.
Durch die o.a. Trennung wird bei einem Redesign nur nötig, das Stylesheet auszutauschen. Schreibt man CSS-Angaben auch in die HTML-Datei, müssen hier auch Änderungen vorgenommen werden. Würde css Zen Garden: The Beauty in CSS Design sonst funktionieren?

Der style-Bereich im head ist für CSS geeignet und da vermischt du auch kein HTML mit CSS. Ich würde zB auch nicht für jede Auszeichnung extra eine CSS-Datei anlegen.

Allein die Tatsache, CSS in HTML-Dateien zu schreiben, macht die Sache unübersichtlich. Natürlich ist es möglich, ich würde es aber nicht empfehlen! Das heißt ja nicht, dass man für jede Auszeichnung eine extra Stylesheet-Datei anlegen muss. Ein Stylesheet für alles reicht ja auch.

Was ich sagen will: Es ist völlig egal ob man CSS in einer extra Datei oder im Headbereich nutzt, auch wnen ich persönlich die erste Variante aus anderen Gründen bevorzuge

Letztlich ist es auch egal, ob man von einem Auto überfahren wird, oder bei einem Flugzeugabsturz ums Leben kommt, tot ist man so oder so. Aber mit strikter Trennung von HTML und CSS wird das Leben leichter!

Gruß,
-Efchen