Wie erreicht man eine fortlaufende Nummerierung in verschachtelten geordneten Listen in HTML?

Nummerierung verschachtelter geordneter Listen in HTML

Beim Erstellen verschachtelter geordneter Listen in HTML ist es üblich, dass die Nummerierung der verschachtelten Elemente bei 1 beginnt. Um eine fortlaufende Nummerierung zu erreichen, befolgen Sie die folgenden Schritte diese Schritte:

CSS-Ansatz (für moderne Browser)

1. Im Fügen Sie im Abschnitt Ihres HTML-Codes den folgenden Stil hinzu:

html>/**/body ol {
    list-style-type: none;
    counter-reset: level1;
}

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

ol li ol {
    list-style-type: none;
    counter-reset: level2;
}

ol li ol li:before {
    content: counter(level1) "." counter(level2) " ";
    counter-increment: level2;
}

jQuery-Ansatz (für IE6/7)

1. Fügen Sie die jQuery-Bibliothek ein der Abschnitt:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

2. Fügen Sie das folgende Skript am Ende des hinzu. Abschnitt:

$(document).ready(function() {
    if ($('ol:first').css('list-style-type') != 'none') { 
        $('ol ol').each(function(i, ol) {
            ol = $(ol);
            var level1 = ol.closest('li').index() + 1;
            ol.children('li').each(function(i, li) {
                li = $(li);
                var level2 = level1 + '.' + (li.index() + 1);
                li.prepend('<span>' + level2 + '</span>');
            });
        });
    }
});

Das obige ist der detaillierte Inhalt vonWie erreicht man eine fortlaufende Nummerierung in verschachtelten geordneten Listen in HTML?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!