Heim > Artikel > Web-Frontend > Ist das Tag li ein Block-Level-Element-Analyse_HTML/Xhtml_Webseitenproduktion
Warum kann es die Höhe festlegen, aber im Gegensatz zu den
-Elementen fühlt es sich an, als wäre es ein „Semi-Inline“-Element (inline: inline[text]-level). HTML 4 wird wie folgt beschrieben:Die folgenden Elemente können ebenfalls berücksichtigt werden Elemente auf Blockebene, da sie Elemente auf Blockebene enthalten können:
Diese Beschreibung scheint zu sagen, dass <li />
ein „Semi-Inline“-Element ist. Natürlich haben auch Elemente, die <td />
in dieser Liste ähneln, bei mir solche Zweifel hervorgerufen. Heute habe ich mir das Standard-CSS jedes Browsers angesehen. Das Ergebnis ist dieses:
Browsers | CSS |
---|---|
IE6/IE7 |
li{display:block; } |
IE8 / Webkit / Firefox / Opera |
li{display:list-item; } |
Hier ist es grundsätzlich klar. In anderen A-Grade-Browsern als IE6/7 handelt es sich um ein „Semi-Inline“-Element. Was display:list-item;
angeht: Obwohl es jetzt von allen A-Grade-Browsern unterstützt wird, verwenden es nicht viele Leute. Warum? Tatsächlich ist es nutzlos. Im Quirks-Modus sagt PPK Folgendes:
display: list-item
bedeutet, dass das Element als Listenelement angezeigt wird, was hauptsächlich bedeutet, dass es ein Aufzählungszeichen davor hat (wie ein UL), außer in IE 5 auf dem Mac, wo es eine Zahl erhält (wie ein OL). Die Zahlen sind fehlerhaft: Alle vorherigen LIs auf der Seite zählen als eins, daher beginnt dieses Beispiel mit Nummer 5 (der Screenshot wurde erstellt, bevor ich meine Kompatibilitäts-LIs eingefügt habe).Live-Beispiel:Anzeige: BlockAnzeige: ListenelementAnzeige: Listenelement
Richtig. Tatsächlich bedeutet das nicht viel. Aber es kann als Lösung eines meiner Zweifel angesehen werden. Wenn Sie auch solche Zweifel haben, vielleicht wenn beim nächsten Mal ein Fehler oder eine andere Frage auftaucht, können Sie wahrscheinlich schnell antworten.