Wie erstelle ich neue Überschriften-Tag-Nummern wie h7, h8 usw.?

Lesezeit: 7 Minuten

Wie erstelle ich neue Uberschriften Tag Nummern wie h7 h8 usw
Steindallas

Wie kann ich eine weitere Überschrift einfügen? HTML?

Ich habe benutzt <h1>, <h2>, <h3>, <h4>, <h5> und <h6>und jetzt möchte ich hinzufügen <h7> und <h8> da ich verschiedene Texttypen habe, die ich verwenden muss.

Wenn Sie dies nicht tun können, gibt es eine Möglichkeit, anzurufen CSS Blätter für Text, sonst dann <p> und <h1><h6>?

  • Sie könnten die CSS-Eigenschaft “font-size”, “font-size:10;font-size:12;…” verwenden.

    – Nocmear

    16. Februar 2013 um 8:39 Uhr

  • Was ist der Anwendungsfall für Überschriften auf mehr als sechs Ebenen? Vielleicht gibt es einen besseren Ansatz.

    – Jukka K. Korpela

    16. Februar 2013 um 9:36 Uhr

  • @JukkaK.Korpela Beim Schreiben eines technischen Buches ist es einfach, über 6 hinauszugehen.

    – Ciro Santilli Путлер Капут 六四事

    18. Juli 2019 um 7:30 Uhr

Sie können dies in Ihrem Stylesheet deklarieren

h7, h8, h9 { /* You can just go on adding headings */
   display: block; /* Because this is block level element */
}

h7 {
   font-size: /*Whatever */ ;
}

h8 {
   font-size: /*Whatever */ ;
}

Aber ich würde Ihnen vorschlagen, dies nicht zu tun, da es keine semantische Bedeutung hat und auch aus SEO-Sicht schlecht ist

Schau auch mal rein html5shivfügen Sie einfach die gewünschten Elemente in das Skript ein

  • Und wie hilft mir das? Ich muss eine Überschrift 7 oder eine Alternative hinzufügen, um das CSS aufzurufen.

    – Stonydallas

    16. Februar 2013 um 8:38 Uhr


  • @Stonydallas Ich habe dich nicht verstanden, wie es dir helfen wird? Wenn Sie fragen, während Sie die Standards im Auge behalten, sollten Sie dies nicht verwenden

    – Herr Alien

    16. Februar 2013 um 8:39 Uhr

  • Wie kann ich dann CSS aufrufen, um den Text zu formatieren?

    – Stonydallas

    16. Februar 2013 um 8:41 Uhr

  • Ich stimme Ihrem Kommentar in Ihrem Beitrag nicht zu. „es hat keine semantische Bedeutung“ es hat so viel semantische Bedeutung wie span, p und div. „aus SEO-Sicht wird es schlecht sein“ es wird für SEO nicht schlechter sein als span, p, div, li.

    – Chris Marisic

    30. September 2014 um 16:16 Uhr

  • @ChrisMarisic Ich würde Ihnen vorschlagen, dies nicht zu tun, da es keine semantische Bedeutung hates ist für die neuen Tags, die er erstellt, also wenn er h7, h8 erstellt, wird es keine semantische Bedeutung haben, auch keine Bedeutung in Bezug auf SEO

    – Herr Alien

    30. September 2014 um 17:25 Uhr

Wie erstelle ich neue Uberschriften Tag Nummern wie h7 h8 usw
brennanyoung

Keine der bisher geposteten Antworten ist ganz richtig. Einige sind ziemlich irreführend.

In html5 kann man ja verwenden h7, h8 und so weiter, und wählen Sie sie mit entsprechenden CSS-Selektoren aus, aber semantisch gesprochen das sind keine Überschriften, sie sind nur Elemente mit unbekannter Semantik – ähnlich wie divs und spans. Außerdem wäre ich überrascht, wenn alle Browser diese “benutzerdefinierten” Elemente konsequent behandeln würden, ohne einen CSS-Wert für bereitzustellen display wenigstens.

Aber du kann spezifizieren Sie die fehlende Semantik mit a role Attribut von "heading", und dies wird für Hilfstechnologien wie Screenreader wichtig sein. Es könnte (vorstellbar) SEO etwas beeinflussen, aber es gibt viele weitaus größere SEO-Probleme als dieses.

Der richtige Weg, eine Überschriftenebene höher als 6 anzugeben, besteht darin, das Attribut einzubeziehen aria-level="7" (oder was auch immer Sie bevorzugen). Wenn Sie dieses Attribut auf etwas anderes anwenden als h1h6 wirst du auch brauchen role="heading".

Daher sind alle folgenden “h7”-Beispiele gültig und korrekt gemäß w3:

<h1 aria-level="7">... (Überschriftsemantik wird von “h1” bereitgestellt, aber 7 überschreibt 1)

<h7 role="heading" aria-level="7">... (Überschriftensemantik bereitgestellt von role)

<div role="heading" aria-level="7">... (Überschriftensemantik bereitgestellt von role)

Und um eines davon in CSS auszuwählen, könnten Sie natürlich Folgendes tun:

*[aria-level="7"] {
    font-size:0.5em;
}

Zu guter Letzt: Überschriften verschiedener Ebenen nicht ineinander verschachteln! Dies verwirrt bekanntermaßen alle Screenreader und wahrscheinlich auch kein gültiges HTML. Schließen Sie jedes Überschriftenelement vollständig, bevor Sie ein neues beginnen. Es ist leicht, dies zu übersehen, wenn Sie verwenden divund Prüfer werden den Fehler höchstwahrscheinlich nicht bemerken.

Auf eine andere meiner Fragen, die völlig unabhängig davon war, erhielt ich eine Antwort auf diese Frage:


Sie können keine Überschrift 7 erstellen, da es nur sechs verschiedene HTML-Überschriften gibt (h1, h2, h3, h4, h5 und h6; Referenz: http://www.w3schools.com/tags/tag_hn.asp), aber Sie können mit diesem CSS-Code eine Überschrift 6 erstellen:

h6.special { color:#464646; outline:0;
    font-family:Raleway, sans-serif; font-size:17px; }

und dieser HTML-Code:

<h6 class="special">I am special!</h6>


Diese Lösung schadet SEO nicht und ist ziemlich einfach. Ich dachte nur, ich sollte es alle wissen lassen. Kannst du als Nebenfrage das “Special” ändern? Sagen Sie, ob ich es geändert habe

h6.raleway { color:#464646; outline:0;
    font-family:Raleway, sans-serif; font-size:17px; }

und dieser HTML-Code:

<h6 class="raleway">I am raleway!</h6>

Würde das funktionieren? Nochmals vielen Dank für alle Antworten!

  • “Sie können keine Überschrift 7 erstellen” ist völlig falsch, solange Ihr Dokumenttyp ist <!DOCTYPE html> für HTML5. Im Gegensatz zu anderen falschen Aussagen wird die Verwendung von H7 SEO nicht schaden, aber ja, die Verwendung von CSS für h6.raleway ist eine Alternative. Dies ist wahrscheinlich eine bessere Lösung, wenn der einzige Zweck darin besteht, die Schriftart zu variieren. Wenn Ihr Zweck darin besteht, dass Sie eine semantische Bedeutung haben, um H7 als kleiner als H6 zu differenzieren, verwenden Sie H7.

    – Chris Marisic

    30. September 2014 um 16:23 Uhr

Der einfache Weg wird sein, Klassen zu verwenden

.h7{ font-size:10px;}
.h8{font-size:7px;}

etwas auf diese Weise und verwenden Sie es mit spans divs .

1647185529 531 Wie erstelle ich neue Uberschriften Tag Nummern wie h7 h8 usw
Ram Khumana

h7, h8, h9 sind keine gültigen HTML-Tags und der Browser kann damit machen, was er will. Sie können Ihre eigene CSS-Klasse erstellen und CSS-Eigenschaften wie h2, h3 usw. verwenden.

Wie:

 h7{
        display: block;
        font-size: 0.51em;
        -webkit-margin-before: 2.99em;
        -webkit-margin-after: 2.99em;
        -webkit-margin-start: 0px;
        -webkit-margin-end: 0px;
        font-weight: bold;
    }

  • Ja, aber wenn ich sie erkläre = h7 {font-size:50px}

    – Stonydallas

    16. Februar 2013 um 8:49 Uhr


  • Es ist vollkommen gültig für HTML5 (als benutzerdefiniertes Element). OP spezifiziert kein HTML4 oder XHTML. Bei XHTML glaube ich, dass es gültig wäre, wenn Sie Ihre eigene DTD bereitstellen, die möglicherweise auch auf HTML4 anwendbar ist.

    – Chris Marisic

    30. September 2014 um 16:17 Uhr


1647185529 623 Wie erstelle ich neue Uberschriften Tag Nummern wie h7 h8 usw
Jukka K. Korpela

Wenn Sie wirklich Überschriften unterhalb der 6. Ebene benötigen (was bedeutet, dass Ihr Dokument in Struktur und Verschachtelung von Abschnitten einem großen Buch entspricht), verwenden Sie div Elemente mit class Attribute. (Mit „benutzerdefinierten Tags“ wie z h7 entspricht nicht den Spezifikationen, verursacht Probleme im IE und erzeugt die Illusion, Überschriften zu verwenden – sie werden keine Überschriften sein, für Suchmaschinen, Gliederungskonstruktion usw.) Beispiel:

<style>
.h7 { font-weight: bold; margin-top: 1em; }
</style>

<div class=h7>Some text</div>

(Es wird schwierig sein, Überschriften auf 7 oder 8 Ebenen so zu gestalten, dass sich die Ebene klar im Erscheinungsbild widerspiegelt und die Schriftgrößen der obersten Ebenen nicht übermäßig groß sind.)

Theoretisch könnten Sie HTML5 verwenden section Elemente, um die Verschachtelungsstruktur von Teilen, Kapiteln, Abschnitten, Unterabschnitten usw. im Dokument zu definieren und nur zB h1 Überschrift in jedem section. Durch die HTML5-CR wird die Verschachtelung von section elements definiert dann die Ebenen der Überschriften, also auf der 7. Verschachtelungsebene, <h1> wäre eine Überschrift der 7. Ebene. Aber selbst für Leute, die im Allgemeinen HTML5 bevorzugen, könnte dies ziemlich verwirrend sein, und um dies in alten Versionen im IE zum Laufen zu bringen, müssten Sie <script>document.createElement('section')</script> as well assection{display:block}` plus Code, der die Überschriften mithilfe von Kontextselektoren formatiert.

Die Formulierung „verschiedene Textsorten, die ich verwenden muss“ deutet darauf hin, dass Sie vielleicht nur nach Möglichkeiten für Gestaltungselemente suchen. Verwenden Sie in diesem Fall div oder p oder einige andere Elemente, mit class Attribute nach Bedarf, je nach Inhalt und Struktur, und machen das Styling in CSS.

  • Ja, aber wenn ich sie erkläre = h7 {font-size:50px}

    – Stonydallas

    16. Februar 2013 um 8:49 Uhr


  • Es ist vollkommen gültig für HTML5 (als benutzerdefiniertes Element). OP spezifiziert kein HTML4 oder XHTML. Bei XHTML glaube ich, dass es gültig wäre, wenn Sie Ihre eigene DTD bereitstellen, die möglicherweise auch auf HTML4 anwendbar ist.

    – Chris Marisic

    30. September 2014 um 16:17 Uhr


998260cookie-checkWie erstelle ich neue Überschriften-Tag-Nummern wie h7, h8 usw.?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy