CSS-Styles ?

[Lukas]

Hallo
Ich habe ein kleines Problem und zwar geht es um ein CSS Style!
Ich habe die verschiedenen Navigationen ( first second und third ) mit einem CSS editor bearbeitet und die Schriftfarbe entsprechen den Hintergrundfarben angepasst !
Dieses wird leider übergangen und die Schriftfarbe bleibt schwarz !
Könntet ihr mir vielleicht sagen wo ich dieses ändern könnte oder wie ich dieses umgehe das die Schriftfarbe standartgemäß schwarz ist ? Bzw. wo ich diese Farben Bearbeiten kann.
Ich entschuldige mich für die mangelhafte Rechtschreibung.
Ich würde mich freuen, wenn Sie mir Ratschläge oder genaue Angaben hinterlassen würden!

[emergence]

wenn du dir ein template ansiehst ->

Code: Alles auswählen

<!-- BEGIN:BLOCK -->
      <tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:10px">
      <a target="{TARGET}" href="{HREF}">{NAME}</a></td></tr>
<!-- END:BLOCK -->

und du möchtest die linkfarbe ändert solltest du dies in der format.css des clients machen...
(A:link, A:visited, A:hover, A:active)
den wert bei color...

der wert im template bei color funktioniert nur wenn ein text ohne link vorhanden wäre...

[Lukas]

Nun danke für die Antwort leider trifft es nicht den genauen Punkt !
Ich wollte die verschiedenen Navigationen also first second und third verändern ( mit unterschiedlichen Linkfarben ).

( habe einen unterschiedlichen background-color sagen wir mal so als Beispiel.

Code: Alles auswählen

// Templates        // Die Farben bei der Schrift sind verschieden. Das mouse over zeigt der Link dann blau.
First schwarz                = Schrift ( Link Farbe weiß ) 
Secodn weiß                = Schrift ( Link schwarz )
Third blau                    = Schrift ( Link rot )

Wissen Sie, was ich meine ?
Könen Sie dabei behilflich sein ?

/edit
Könnte man nicht in die format.css mehrer sachen einbauen ?
Bzw etwas für die first second und third Navigation in die format.css schreiben damit man für die sachen eine übersicht hat ? ?
Wüsste jemand von euch wie ?

Danke

[Lukas]

Code: Alles auswählen

A:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #000080}
A:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000080}


A.klein:link	{font-family: helvetica, arial, geneva, sans-serif; font-size:11; text-decoration: none; color: #000000}
A.klein:visited {font-family: helvetica, arial, geneva, sans-serif; font-size:11; text-decoration: none; color: #000000}
A.klein:hover	{font-family: helvetica, arial, geneva, sans-serif; font-size:11; text-decoration: underline; color: #000080}
A.klein:active	{font-family: helvetica, arial, geneva, sans-serif; font-size:11; text-decoration: none; color: #000080}

Könntet Ihr mir villeicht den Unterschied zwischen A:link und A.klein:link
nennen ?
Dazu wollte ich fragen, ob man nicht in den Styleeditor für die verschieden Templates ( navfirst_on navfirst_off, navsecond_on navsecond_off, navthird_on navthird_off ) nicht eine eigenständige Zeile einrichten kann also so in der art

Code: Alles auswählen

A.first:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.first:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.first:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #000080}
A.first:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000080} 

A.second:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.second:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.second:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #000080}
A.second:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000080}

A.third:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.third:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000}
A.third:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #000080}
A.third:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000080} 

Wäre soetwas nicht möglicht ?
Es wäre nett wenn ihr eine Antwort bis zum Freitag wüsstet.
Ich wäre euch sehr dankbar!
Mit freundlichem Grüß
Lukas

[CyberDan]

dein Versuch ist schonmal nicht schlecht. Wenn du jetzt in das <a> noch jeweils class="first" (usw) einträgst, dann hast du auch deine richtigen links und kannst die drei Navigationsebenen getrennt bearbeiten über css.
dein Link sollte dann so aussehen (erste ebene):

Code: Alles auswählen

<!-- BEGIN:BLOCK --> 
      <tr><td width="165" colspan="2" height="22" style="border: 0px; border-bottom:1px; border-color: #F7C473; border-style: dashed; background-color: #FCF2D5; padding-left:10px"> 
      <a target="{TARGET}" href="{HREF}" class="first">{NAME}</a></td></tr> 
<!-- END:BLOCK -->

Somit wird dem Link der Style für die erste ebene zugewiesen.
Das :link kannst du eigentlich immer weglassen, so dass als erstes nur a.first im CSS steht.

[Lukas]

Ersteinmal danke für den Tipp!
Aber irgend was mache ich falsch oder klappt nicht. Vielleicht könnten Sie ja weiterhelfen.

Code: Alles auswählen

A.first:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #FFFFFF} 
A.first:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000} 
A.first:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #FFFF00} 
A.first:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #FFFF00}

A.second:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #FFFFFF} 
A.second:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000} 
A.second:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #FFFF00} 
A.second:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #FFFF00} 

A.third:link           {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #0000A0} 
A.third:visited        {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #000000} 
A.third:hover          {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: underline; color: #FFFF00} 
A.third:active         {font-family: helvetica, arial, geneva, sans-serif; font-size:13; text-decoration: none; color: #FFFF00} 

Steht nun im Styleeditor.

Code: Alles auswählen

<!-- BEGIN:BLOCK -->

      <tr><td width="165" colspan="2" height="22" style="border-right: #FFFFFF 2px inset;
border-top: #001B97 2px outset;
font-weight:Bold;
font-size: 10pt; 
border-left: #001B97 2px outset;
color: #000000;
border-bottom: #001B97 2px inset;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #001B97; ">

      <a target="{TARGET}" href="{HREF}">{NAME}class="first"</a></td></tr>

<!-- END:BLOCK -->

Das ist die navifirst_off

Code: Alles auswählen

<!-- BEGIN:BLOCK -->

      <tr><td width="165" colspan="2" height="22" style="border-right: #FFFFFF 2px inset;
border-top: #001B97 2px outset;
font-weight:Bold;
font-size: 10pt; 
border-left: #001B97 2px outset;
color: #FFFFFF;
border-bottom: #001B97 2px inset;
font-family: Verdana, Arial, Helvetica, sans-serif;
background-color: #001B97; ">

      <a target="{TARGET}" href="{HREF}">{NAME}class="first"</a></td></tr>

<!-- END:BLOCK -->

Und das ist die navifirst_on

Leider ist jetzt alles auf der Homepage ziehmlich anders als es sollte!
Ein Punkt durch das verändern des Styleeditors ist besser geworden, die Second- und firstnavigationen sind eingerückt.
Nun leider steht jetzt hinter den Links class="first" ...
Was mache ich flasch ?
Dazu haben sich die farben der Links und die Schriftfarben nicht verändert und haben das standartgemäße blau lila angenommen.
Ich bitte um weitere Hilfe !

[emergence]

Code: Alles auswählen

<a target="{TARGET}" href="{HREF}">{NAME}class="first"</a>

sollte so aussehen

Code: Alles auswählen

<a target="{TARGET}" href="{HREF}" class="first">{NAME}</a>

[CyberDan]

oops, da war ich wohl zu schnell mit meinem code reinkopieren
natürlich hat emergence recht *schäm*

ich habs auch gleich im meinem Post oben geändert, damit ncht noch jemand auf die idee kommt, das anzuwenden...

[Lukas]

Juhu!!!! Danke an euch beiden es funktioniert!!! Superklasse
Herzlichen Dank für eure Bemühungen !

[Lukas]

Zufrüh gefreut...
Nun habe ich ein weiteres Problem undzwar ( was komisch ist ) bei mir auf dem Monitor ( ein älteres Modell ) werden die unterschiedlichen Fabren nicht gezeigt sondern alles bleibt schwarz. Also bin ich runter zu meinem Chef und habe dort geguckt... bei ihm sind sie z.t. weiß und z.t. schwarz also bei jedem anders.
Dieses könnte natürlich an den 2 verschieden Templates liegen, die wir nutzen.
Leider weiß ich nicht wie soetwas angehen kann.
Falls ihr mal ein blick drauf werfen wollt.
www.santan.de ( soll keine Werbung sein lediglich als Hilfe gedacht sein )!
Ich bin lediglich ein Praktikant der sich den Aufgaben annimmt und jetzt nicht mehr weiter weis. Ich würde mich über weiter Hilfe freunen!
/edit außerdem habe ich eine frage und zwar wie kann man das machen, dass die Navigation genau so aneinander gereiht bleibt, wie sie im index zusehen ist ?
Bei jedem weiteren Menupunkt ist eine lücke dazwischen.
Entschuldigung falls diese Fragen lächerlich sind aber ich weiß nicht weiter.

Und wie bekomme ich die second und third navigation ein wenig eingerückt weil sie ja jetzt ausgerückt sind ?

[CyberDan]

nimm mal jeweils aus dem CSS die Zeilen mit :active und :visited.
Die Zeile, die dir Probleme bereitet ist die visited. Der IE (und soweit ich weiß nur dieser) speichert, ob du einen link besucht hast, und gibt diese Farbe aus (in deinem Fall schwarz)

[Lukas]

Wenn ich das mache kommen wieder die lila Links ( auf denen ich schon drauf war ) ...
Also müsste es ja irgend wie an dem Template liegen oder irre ich mich da ?
Bloß frage ich mich, wo dieser Fehler sich versteck.
/ edit ok diesen fehler habe ich beseitigt !
Nun nur noch die Frage, wie ich das ausrücken der Zeilen verhindere und wie sich die Zeilen einrücken lassen.
Und dazu noch wie ich den Abstand zwischen den Zeilen minnimiere also das sie sozusagen in einem übergehen ?
Wissen Sie rat ?

[FrankHoffmann]

Hi Lukas,

ich finde das Konzept mit den Templates, die wiederum CSS aufrufen nicht schlüssig und umständlich. Ich habe die Hauptnavigation daher umgebaut und die Templates rausgeschmissen. Die Navigation basiert nun ausschliesslich auf CSS, was viel einfacher zu adminstrieren ist

Unter http://test.x28.de user admin pwd test28

kannst Du Dir das Modul ja mal ansehen. Die passende CSS-Datei findest Du dort auch (für das aktuelle Layout wird format.css verwendet).

Viel Spaß beim Stöbern.

[Lukas]

Hi FrankHoffmann
Sehr interessant muss ich sagen doch leider finde ich deine Art zu aufwendig! Was nicht heißen soll das sie nicht auch klasse gemacht ist!
Ich weiß das es ein paar kleine Probleme dabei gibt aber das lässt sich nicht genau wiederufen ( bei meinem Vorschlag) nun leider kommt das auch immer auf den IE oder sonstiges an
Da ich zuhause Mozilla nutze wird mir z.t. bei meiner Navigation und deren verschiedenen Sachen kaum was angezeigt hier in der Firma jedoch funktioniert alles!
Komischer weise: roll:
Ok ich habe mir das noch mal genauer angeschaut...
Ich finde es ganz gut leider aber wird dort alles sehr lang und damit für mich unübersichtlich ...
Bei mir jedoch hat man da seine paar großen Sachen stellt alles ein usw.. Das ist dann für den kleinen man ohne viel wissen ausreichend denken ich!
Dazu habe ich die ganzen Sachen von wegen wo was steht mit Frames und in dem Layout fest gelegt!
Was sich bei uns beiden wieder unterscheidet.
Gute Variante mein Lob.

/edit ach ja du kommst ganz auf meiner nähe ich arbeite momentan in Stuhr als Praktikant
Kennst du Syke ? da in der nähe wohne ich
Nochmal zu dem umständlichen und dem Templates ich habe es so gemacht weil ich keine andere Möglichkeit sah. Leider habe ich auch nicht so das hammer wissen in sachen php, html. Deswegen versuche ich einfach und schnell zu coden. Dazu mag ich es nicht wenn ich ellen lange Zeilen habe irgend wann steige ich nicht mehr durch und ich mir dann lieber bildlich alles vorstelle geht das über mehrer umwege für mich besser

[FrankHoffmann]

Hi Lukas,

den Aufwand bei CSS-Design muss man aber nur einmal betreiben. Mit der Länge meinst Du wohl die Länge der CSS-Datei? Da hast Du recht. Man sollte schon gut kommentieren. Richtig gute CSS-Editoren mit WYSIWYG vermisse ich auch. Aber es ist halt sehr viel einfacher zu administrieren wenn man Design und Inhalt strikt trennt.