Anzeige

Hilfe beim Mehrfarbigen horizontalen Tabmenue

Hilfe beim Mehrfarbigen horizontalen Tabmenue | PSD-Tutorials.de
  1. Information ausblenden
  2. Information ausblenden
HTML - Dieses Training empfehlen wir dir! Photoshop-Looks und Styles gratis

Erstellt von Ferro, 10.03.2011.

  1. Ferro

    Ferro Noch nicht viel geschrieben

    Dabei seit:
    14.01.2010
    Beiträge:
    10
    Geschlecht:
    männlich
    Ort:
    Berlin
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    10.03.2011 15:40
    #1     ▲ 
  2. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.079
    Geschlecht:
    männlich
    Ort:
    Ö
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    10.03.2011 15:45
    AW: Hilfe beim Mehrfarbigen horizontalen Tabmenue

    Um es kurz und bündig zu beantworten (Mehr ist es nämlich nicht):
    Du kannst jedem <li> eine eigene ID geben, dann kannst du auch jeden Punkt seperat stylen.

    L. G.
     
    #2     ▲ 
  3. tr4ze

    tr4ze Mod | Forum Teammitglied PSD Beta Team

    422
    Dabei seit:
    02.09.2006
    Beiträge:
    2.038
    Geschlecht:
    männlich
    Ort:
    Nordhorn
    Software:
    CS6, Intuos
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    10.03.2011 16:02
    AW: Hilfe beim Mehrfarbigen horizontalen Tabmenue

    Grundsätzlich richtig, aber nicht mit einem ID. Eine Klasse währe der bessere weg
    z.B.



    Code (Text):
    1.  
    2. .button {
    3.   ...
    4. }
    5. .red {
    6.   ...
    7. }
    8. .green {
    9.   ...
    10. }
    11. <li class="button red"></li>
    12. <li class="button green"></li>
     
    #3     ▲ 
  4. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.079
    Geschlecht:
    männlich
    Ort:
    Ö
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    10.03.2011 16:36
    AW: Hilfe beim Mehrfarbigen horizontalen Tabmenue

    Wieso wäre (ohne h) eine Klasse der bessere Weg? Sicher kann man es auch über eine Klasse lösen, jedoch sollte jeder Menüpunkt doch nur einmal auf der Seite vorkommen, deshalb kann man auch eine id verwenden :)
    Sollten zwei Buttons gleich gestyled werden, dann sind Klassen natürlich der richtige Weg, das stimmt. :)

    L. G.

    Edit: Den Zustand für aktiv/inaktiv sollte man natürlich schon über eine Klasse steuern. Ja was für einen selber logisch ist, ist für denjenigen der keine Ahnung hat nicht ganz so offensichtlich ;) Also prinzipiell sind Klassen und IDs (oder auch nur Klassen, kommt auf das Menü an) dein Freund in der Sache. (Und Ferro ist jetzt hoffentlich nicht endgültig verwirrt :D )
     
    Zuletzt bearbeitet: 10.03.2011
    #4     ▲ 
  5. tr4ze

    tr4ze Mod | Forum Teammitglied PSD Beta Team

    422
    Dabei seit:
    02.09.2006
    Beiträge:
    2.038
    Geschlecht:
    männlich
    Ort:
    Nordhorn
    Software:
    CS6, Intuos
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    10.03.2011 21:35
    AW: Hilfe beim Mehrfarbigen horizontalen Tabmenue

    Nun, wen man die <li> tags als Objekte versteht so haben alle die selbe Eigenschaft, nämlich "button".
    Alle haben nun noch eine weitere Eigenschaft z.B. "red" oder "green" oder"active".
    Das lässt sich mit Klassen einfach viel flexibler lösen.
    Wenn ich ein Objekt im Markup habe, das nur einmal vorkommt und dessen Eigenschaft auch nur einmal vorkommt, dann ist ID besser, weil eindeutiger. Hier wäre(ohne h ;)) z.B. das Elternelement <ul> dafür prädistiniert id="navigation".

    z.B. So:

    Code (Text):
    1.  
    2. /* Start Navigation */
    3. #navigation {
    4.   ...
    5. }
    6. .button {
    7.   ...
    8. }
    9. .active {
    10.   ...
    11. }
    12. /*End Navigation */
    13.  
    14. /* Start Navigation prop*/
    15. .green {
    16.   ...
    17. }
    18. .red {
    19.   ...
    20. }
    21. /*End Navigation prop*/
    22.   <ul id="navigation">
    23.       <li class="button green active"></li>
    24.       <li class="button red"></li>
    25.   </ul>
    26.  
    Natürlich kann man jedes Element im Baum mit einem eigenen ID Ausweisen, nur schreibt man dann auch demensprechend viel. ;)

    Weil :
    Code (Text):
    1. <li id="button" class="green active"></li>
    zwar in den meisten Browsern keinen Fehler wirft, aber eben symantisch auch nicht korrekt ist, da <li id="button"> ja mehrfach vorkommt.

    Ich hoffe das war verständlich, und ich brabbel hier nicht wirres Zeug. :)
     
    #5     ▲ 
  6. Myhar

    Myhar Hat es drauf

    Dabei seit:
    01.11.2007
    Beiträge:
    2.079
    Geschlecht:
    männlich
    Ort:
    Ö
    Hilfe beim Mehrfarbigen horizontalen Tabmenue
    11.03.2011 08:51
    AW: Hilfe beim Mehrfarbigen horizontalen Tabmenue

    Nur so war das von mir auch nicht gemeint :D
    Wenn wirklich jeder Menüpunkt anders gestyled werden soll, dann kann jeder Menüpunkt natürlich eine andere ID bekommen. Doppelte IDs sind ja grundsätzlich zu vermeiden :)
    Aber irgendwie führt diese Diskussion zu nichts, da wir beide Recht haben. Ich habe mir jedoch schon fast gedacht, dass mein Vorschlag IDs zu verwenden so eine Diskussion auslöst ;-)

    L. G.

    Wieder mal Edit: Ich hab mir die FC Seite mal genauer angesehen, die setzen Ihre Navigation mittels JS um, was aber unnötig ist. Das geht auch ohne JS (siehe tr4ze und meine Posts)
     
    #6     ▲ 
x
×
×