Wie ändert man in CSS die Schriftgröße von h1 und h2

Lesezeit: 2 Minuten

Ahmed

In einem WordPress-Twenty-Eleven-Theme. Ich möchte die Größe von Überschriften ändern, wenn ich meine Überschriften wie folgt um h1- und h2-Tags wickle

<h1>My h1 heading </h1>
<h2> My h2 heading </h2>

Die Schriftgröße der Überschrift in dem von mir verwendeten Design ist fast dieselbe wie die Schriftart des Inhalts, außer dass sie fett sind. Meine Überschriften sind also nicht ganz prominent.

Ich denke, ich müsste etwas in der CSS-Datei ändern. Bitte geben Sie an, was Sie genau eingeben müssen.

Das mag offensichtlich erscheinen, aber vergewissern Sie sich, dass sich in dem Container, den Sie gerade betrachten, kein anderer Container befindet, der eine Schriftgröße definiert. 🙂

– Amalgowinus

5. August 2014 um 23:15 Uhr
Stellen Sie außerdem sicher, dass niemand !important in einer anderen CSS-Datei verwendet hat. Ich bin hier gelandet (diese Frage), weil ich versucht habe, die Größe von h2 auf einer bestimmten Seite zu ändern, und es sich einfach nicht geändert hat. Ich fing an zu glauben, dass ich verrückt werde und die falsche Syntax oder so etwas verwende. Irgendwann fand ich heraus, dass jemand anderes h2 size !important viel weiter flussaufwärts eingestellt hatte. Pfui. Verwenden Sie niemals “!important”…

– ZeekLTK

17. Juli 2015 um 14:47 Uhr
Sie können in einigen Fällen auch die Schriftgröße von h1- oder h2-Tags ändern, indem Sie das Stilargument direkt in HTML setzen, z <h1 style="font-size:2.25rem;">My h1 heading </h1> und lassen Sie die anderen Header von der .css-Datei festlegen

– Elias

10. Februar 2021 um 17:25 Uhr

Bram Vanroy

h1 {
  font-weight: bold;
  color: #fff;
  font-size: 32px;
}

h2 {
  font-weight: bold;
  color: #fff;
  font-size: 24px;
}

Beachten Sie, dass Sie nach der Farbe ein Wort verwenden können (z white), ein Hex-Code (zB #fff) oder RGB (zB rgb(255,255,255)) oder RGBA (zB rgba(255,255,255,0.3)).

 h1 { font-size: 150%; }
 h2 { font-size: 120%; }

Stimmen Sie nach Bedarf ab.

Was hast du versucht? Das sollte funktionieren.

h1 { font-size: 20pt; }
h2 { font-size: 16pt; }

Wenn Sie einen Header speziell ändern möchten, ist dies eine viel einfachere Lösung

<style>
    h1.increase {
       font-size: 15px;
}
</style>

<h1 class="increase">Header</h1>

Wenn Sie nur die Schriftgröße ändern, kann es bei kleineren Gerätetypen vorkommen, dass sich der Text überschneidet.

<style>
.heading-1{
  font-size: 350%!important;
}
</style>

<h1 class="heading-1">
  Get in Touch
</h1>

Um es reaktionsfähig zu machen, sollten Sie auch die Zeilenhöhe anpassen.

<style>
.heading-1{
  font-size: 350%!important;
  line-height: 120%!important;
}
</style>

<h1 class="heading-1">
  Get in Touch
</h1>

14068000cookie-checkWie ändert man in CSS die Schriftgröße von h1 und h2

#CSS #html-Überschrift #WordPress