Honey: ul li - tags verändern

Hallo,

Hab mal gehört, dass man mit CSS die ul und li tags verändern kann. so dass zb ein ganz anderes menü dabei herauskommt, so im explorer style.
denke ihr wisst was ich meine ;)
wie geht das?

Danke
Honey

  1. Hi,

    Hab mal gehört, dass man mit CSS die ul und li tags verändern kann.

    man kann mit CSS jedes Element verändern. Für CSS existiert nicht der geringste Unterschied zwischen irgend welchen Elementen. Was mit einem <div>, <p>, <strong> oder <foo> geht, geht auch mit einem <a>, <li>, <span> oder <bar>.

    denke ihr wisst was ich meine ;)

    Ich weiß was Du meinst, aber nicht, welches Problem Du hast. Von daher vermute ich, dass Du das CSS-Kapitel von SelfHTML konsumieren möchtest.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi!

      Ich weiß was Du meinst, aber nicht, welches Problem Du hast. Von daher vermute ich, dass Du das CSS-Kapitel von SelfHTML konsumieren möchtest.

      Zusätzlich sei dem OP noch http://css.maxdesign.com.au/listamatic/ zur Lektüre empfohlen.

      Gruß aus Iserlohn

      Martin

  2. Hallo,

    Hab mal gehört, dass man mit CSS die ul und li tags verändern kann. so dass zb ein ganz anderes menü dabei herauskommt, so im explorer style.

    du kannst die li-Elemente z.B. auch nebeneinander positionieren, vielleicht
    per display oder float. Vielleicht gibt es dazu schon in SelfHTML
    Beispiele, sonst kannst du per Suche im Archiv fündig werden.

    denke ihr wisst was ich meine ;)

    explorer style? Nee.

    wie geht das?

    Ein Beispiel zu Listen findest du bei Listen Menu CSS für alle Browser,
    wahrscheinlich findest du aber übers Archiv noch einfacherere Beispiele
    ohne die CSS-Weichen für ältere Browser usw., lass dich also nicht
    gleich von einer einfacheren Lösung abhalten.

    Grüsse

    Cyx23

    1. Hi,

      Vielleicht gibt es dazu schon in SelfHTML Beispiele

      wieso vielleicht. Dazu gibt es die umfangreiche Seite CSS-basierte Navigationsleisten - daß Du die noch nicht kennst...

      wahrscheinlich findest du aber übers Archiv noch einfacherere Beispiele
      ohne die CSS-Weichen für ältere Browser usw.

      weitgehend ohne - aber wenn, dann valide. ;-)

      freundliche Grüße
      Ingo

    2. Hallo Cyx23,

      explorer style? Nee.

      http://www.sprachlernspiele.de/selftests/klappmenue/tree.html

      Ich finde schon, dass mein Listen-Menü dem nahekommt.

      Vielleicht kriege ich demnächst auch mal den Arsch hoch und schreibe eine Bauanleitung dazu.

      Wer auch ohne klarkommt, mag hier schon mal stibitzen:

      http://www.sprachlernspiele.de/selftests/klappmenue/tree.zip

      Gruß Gernot

      1. Hi,

        Das ding ist genau was ich gesucht habe, jedoch läuft es nicht da wo es laufen soll. Was ich sehr merkwürdig finde ist das nach jedem <li>-tag ein <a>-tag folgen MUSS und davon nur einer! also sehr komscih gestrickt das teil.

        Honey

        1. Hallo honey,

          Das ding ist genau was ich gesucht habe, jedoch läuft es nicht da wo es laufen soll. Was ich sehr merkwürdig finde ist das nach jedem <li>-tag ein <a>-tag folgen MUSS und davon nur einer! also sehr komscih gestrickt das teil.

          Das muss nicht unbedingt so sein, du kannst es dir auch umprogrammieren. Ich habe es nach diesem festen Strickmuster so angelegt, damit die Klassenzuordnung per Node-Objekt automatisch erfolgen kann und man sich darum, ob ein Listenpunkt nun ein erster, mittlerer oder letzter ist (was ja unterschiedliche Strichelungen nach sich zieht), und ob ein Listenpunkt seinerseits eine weitere Liste enthält (was Plus- oder Minussymbol impliziert) keine Gedanken zu machen braucht.

          Gruß Gernot

          1. Hey Gernot,

            ... aha ... ja ... soso ...

            und wieso darf dann nur ein <a>-tag in jedem <li>-tag stehen?
            wo stelle ich das wie um?

            Honey

            1. Hallo honey,

              und wieso darf dann nur ein <a>-tag in jedem <li>-tag stehen?
              wo stelle ich das wie um?

              Es bot sich in meinem Beispiel so an, dass das A-Element den gesamten Text im List-Item umfasst. Du könntest auch ein anderes Element nehmen, etwa ein SPAN mit den entsprechenden CSS-Auszeichnungen und Eventhandlern, die im Moment diesem List-Item-Link zugeordnet sind. Ein solches innerhalb des LI-Elements den Text umschließendes weiteres Element ist erforderlich, wenn man über Eventhandler verhindern will, dass bei Klick darauf die übergeordnete UL-Liste gleichzeitig mit auf- bzw. zuklappt. Wenn du ein anderes Element dafür benutzt, dann könntest du bei entsprechneder Anpassung des JS-Codes auch mehrere A-Elemente in einem Listenpunkt haben.

              Die Anpassung des Codes dürfte aber nicht so einfach sein. Auf die automatische Klassenzuweisung müsste man dann vielleicht auch verzichten.

              Gruß Gernot

      2. Hallo,

        Ich finde schon, dass mein Listen-Menü dem nahekommt.

        jetzt kann ich mir unter "explorer style" auch etwas vorstellen, ähnlich wie
        hier in der Sitemap, was aber irgendwann eine Lösung nur per CSS ausschliesst.

        Grüsse

        Cyx23