PDA

Archiv verlassen und diese Seite im Standarddesign anzeigen : Probleme mit css und links



Mr.Sailer
18-02-2005, 13:19
Hallo,

Ich habe in einem Dokument ein paar Links die anders aussehen sollten als die anderen jetzt habe ich gedacht ich mach das mit css. habe die dann auch so definiert:



a.weiss {color: '#FFFFFF'; text-decoration: none;}
a:hover.weiss {color: '#FFFFFF'; text-decoration: none;}
a:visited.weiss {color: '#FFFFFF'; text-decoration: none;}
a:active.weiss {color: '#FFFFFF'; text-decoration: none;}
a:focus.weiss {color: '#FFFFFF'; text-decoration: none;}


und die Links so definiert:



<a href="pdf/AGB.pdf" target="_blank" class="weiss"><center>AGB</center></a>


Aber irgendwie übernehmen sie die Farbe weiss nicht.

Das text-decoration none geht aber die Farbe nicht.

Ich weiss irgendwie nicht mehr weiter, das müsste doch eigentlich funktionieren oder?

MfG
Mr. Sailer

Pingu
18-02-2005, 13:53
Aber irgendwie übernehmen sie die Farbe weiss nicht.
Was sagt SelfHTML? Wie werden Farben angegeben? (http://de.selfhtml.org/css/formate/wertzuweisung.htm#farben)

a.weiss {color: #FFFFFF; text-decoration: none;}
Wie hast Du sie angegeben?


a.weiss {color: '#FFFFFF'; text-decoration: none;}
Unterschied aufgefallen?

Dann, wie ist die Reihenfolge bei Definition?

tag.klasse:pseudo

Wie ist sie bei Dir?



a.weiss {color: '#FFFFFF'; text-decoration: none;}
a:hover.weiss {color: '#FFFFFF'; text-decoration: none;}
a:visited.weiss {color: '#FFFFFF'; text-decoration: none;}
a:active.weiss {color: '#FFFFFF'; text-decoration: none;}
a:focus.weiss {color: '#FFFFFF'; text-decoration: none;}

Unterschied aufgefallen?

Was hat da das <center>-Tag verloren?



<a href="pdf/AGB.pdf" target="_blank" class="weiss"><center>AGB</center></a>

Es gibt kein <center>-Tag.
Also wenn schon mittig, dann bitte richtig:


<a href="pdf/AGB.pdf" target="_blank" class="weiss mittig">AGB</a>



.mittig {
text-align: center;
}

Besser im Sinne der Inhalt/Layout-Trennung ist natürlich die inhaltliche Auszeichnung:


<span class="agb"><a href="pdf/AGB.pdf" target="_blank">AGB</a></span>



.agb {
text-align: center;
}

.agb a {
color: #FFFFFF;
text-decoration: none;
}

.agb a:hover {
text-decoration: underline;
}


Pingu

Mr.Sailer
18-02-2005, 14:12
Vielen Dank für all die guten Tipps und verbesserungen.

Ich brauche das center-Tag leider noch viel zu viel aber es ist so einfach ;)

Aber irgendwie funktioniert deine Methode bei mir nicht. Kann es daran liegen das die Links in einer Tabelle sind?

MfG
Mr. Sailer

Pingu
18-02-2005, 14:16
Aber irgendwie funktioniert deine Methode bei mir nicht. Kann es daran liegen das die Links in einer Tabelle sind?
Welche Methode? Das Weiß oder das Center?

Pingu

Mr.Sailer
18-02-2005, 14:41
Das Center aber ich habe gerade gemerkt das ich es in einer Tabelle habe und dann gleich im <td>-Tag habe und dann gleich dort angeben kann align="center"

Vielen Dank.

MfG
Mr. Sailer

ohcibi
21-02-2005, 16:52
Besser im Sinne der Inhalt/Layout-Trennung ist natürlich die inhaltliche Auszeichnung:


<span class="agb"><a href="pdf/AGB.pdf" target="_blank">AGB</a></span>



.agb {
text-align: center;
}

.agb a {
color: #FFFFFF;
text-decoration: none;
}

.agb a:hover {
text-decoration: underline;
}


Pingu

<span> ist ein inline element, ein text-align:center interessiert <span> also relativ wenig... <span> muesste also zunaechst ein display:block erhalten.. da sich ein <span> mit display:block aber kaum von einem normalen <div> unterscheidet wuerde er seinen anspruechen also folgendermaßen gerecht werden....



<div id="agb"><a href="agb.html" target="_blank">agb</a></div>

da agb erwartungsgemaeß nur einmal auf einer seite auftaucht reicht ein id anstatt eines class... (das target attribut gibt es uebrigens im stricten html genauso wenig wie das <center>tag wieso weist du darauf nicht hin pingu?)

css:


div#agb {
text-align:center;
}
div#agb a {
color:#fff; /* doppelzahlen wie ff oder 33 lassen sich auf f oder 3 reduzieren */
text-decoration:none;
}
div#agb a:hover {
/* und so weiter */
}


eine inhaltliche frage zum css:

hab ich das richtig verstanden, dass man mit class="class1 class2" ein objekt sowohl class1 als auch class2 zuordnen kann?

msi
27-02-2005, 20:29
eine inhaltliche frage zum css:

hab ich das richtig verstanden, dass man mit class="class1 class2" ein objekt sowohl class1 als auch class2 zuordnen kann?

hab ich auch noch nicht gewusst, aber ganau so geht das.
siehe auch http://www.css4you.de/trickkiste/tr00029.html

Pingu
27-02-2005, 22:21
(das target attribut gibt es uebrigens im stricten html genauso wenig wie das <center>tag wieso weist du darauf nicht hin pingu?)Weil ich nicht alles weiß. Ich habe z.B. heute auch erst herausgefunden, daß Firefox das Attribute width und height manchmal nur akzeptiert, wenn es mit Einheit angegeben wird. Ich weiß nicht wieso. Es ist aber so.


eine inhaltliche frage zum css:

hab ich das richtig verstanden, dass man mit class="class1 class2" ein objekt sowohl class1 als auch class2 zuordnen kann?
Yep, dies ist richtig. Wobei class2 in Deinem Beispiel (als die jeweils die letzte) Eigenschaften der class1 (als der Vorherigen) gegebenfalls überschreibt.

Übrigens sehr hilfreich empfinde ich den DOM-Inspector im Firefox. Weil da kann man sich sehr schön anzeigen lassen welche Regeln in welcher Reihenfolgen gelten.

Pingu