2009-03-02 23 views
5

Ich versuche herauszufinden, wie man eine inkrementelle geordnete Liste erstellt, die derzeit auf IE6 und IE7 ausgerichtet ist.Listenelemente in Listenelementen einer geordneten Liste verschachteln?

E.G. Es sollte so etwas wie unten machen:

1.0 
    1.1 
    1.2 
    1.3 
2.0 
    2.1 
    2.2 

Von dem, was ich verstehe, ist das möglich in CSS mit so etwas zu schaffen:

UL, OL { counter-reset: item; } 
LI { display: block } 
LI:before { content: counters(item, "."); counter-increment: item } 

jedoch natürlich, IE6 und IE7 nicht unterstützen Dies.

Welche Optionen sind verfügbar, um eine korrekte inkrementierte Liste in IE6/7 zu erstellen? Bin ich fest, dass ich das hart programmieren muss? Leider ist die Verwendung von JavaScript keine Option.

Gibt es aktualisierte Methoden für neuere Browser?

+0

O btw, danke Andrew für die Formatierung fix. –

Antwort

0

Wenn Javascript keine Option ist (und deshalb nehme ich auch keinen Flash an), tut mir leid zu sagen, dass Sie keine Optionen für eine clientseitige Lösung haben. Wenn Sie ein serverseitiges Skript haben, das Ihren HTML-Code generiert, können Sie die Bestellung an den Server senden und die Ausgabe auf dem Client einfach mit CSS als ungeordnete Liste ohne Aufzählungszeichen formatieren. IE6 ist hier der limitierende Faktor, und es gibt nicht viele Möglichkeiten. Es tut mir leid, der Überbringer schlechter Nachrichten zu sein.

0

Wenn JavaScript keine Option ist, müssen Sie es hart codieren/implementieren es auf der Serverseite.

Die positive Seite ist: Es wird für andere weniger fähige Benutzer-Agenten/Geräte (Think BlackBerry Browser usw.) sofort funktionieren.

1

XSLT (einschließlich XSLT 1.0) kann mehrstufige Nummerierungssequenzen mit <xsl:number> generieren. Hier

+0

Dies sieht wie eine Möglichkeit aus, da die endgültige Ausgabe XHTML 1.0 streng ist. Danke allen für die schnellen Antworten. Irgendwelche anderen Vorschläge werden mehr als glücklich betrachtet. –

1

ist eine CSS einzige Lösung (sollte in IE8 arbeiten und oben):

<ol> 
    <li> 
     Heading 
     <ol> 
      <li>list</li> 
      <li>list</li> 
     </ol> 
    </li> 
    <li> 
     Heading 
     <ol> 
      <li>list</li> 
      <li>list</li> 
     </ol> 
    </li> 
</ol> 



ol{ 
    list-style-position:inside; 
    list-style-type: none; 
    counter-reset:mainNum; 
} 

ol li:before{ 
    content: counter(mainNum) ".0"; 
    counter-increment:mainNum; 
} 

ol ol{ 
    counter-reset:item; 
} 

ol ol li{ 
    list-style-type:none 
} 

ol ol li:before{ 
    content: counter(mainNum) "." counter(item) " "; 
    counter-increment:item; 
} 
Verwandte Themen