Überschrift h1, h2 etc... in CSS neu gestalten

Dieses Thema im Forum "HTML & CSS" wurde erstellt von Getty-Sports, 10. Januar 2023.

  1. Getty-Sports
    Getty-Sports Mitglied
    Registriert seit:
    13. Dezember 2022
    Beiträge:
    14
    Zustimmungen:
    0
    Gegebene Danke:
    1
    Hallo,

    wir benutzen das Malibu-Theme und möchten gerne der Überschriftenstruktur ein neues Design verpassen. Dazu möchten wir gerne CSS benutzen.
    Die Überschrift sollte wieder linksbündig sein und der kleine horizontale Unterstrich soll weg.
    Wie kann ich das machen mit CSS?

    Der folgende Code funktioniert nicht. :(

    .h1
    {
    text-align: left;
    }

    Über Hilfe sind wir sehr dankbar!

    Schöne Grüße
    Timo
     
  2. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    28. Dezember 2020
    Beiträge:
    444
    Zustimmungen:
    232
    Gegebene Danke:
    83
    ohne Punkt:
    h1
    {text-align: left;}

    Bedenke es werden dann alle h1 über css angesprochen!
     
  3. Kai Stejuhn
    Kai Stejuhn Beta-Held
    Registriert seit:
    26. September 2014
    Beiträge:
    1.500
    Zustimmungen:
    773
    Gegebene Danke:
    96
    Wo genau möchtest Du das denn ändern? Ist das da denn eine H1-Überschrift? Ein Link zur Baustelle ist nie verkehrt.
     
  4. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    28. Dezember 2020
    Beiträge:
    444
    Zustimmungen:
    232
    Gegebene Danke:
    83
    Ohne horizontalen Unterstrich:
    h1 {border-bottom: none;}
     
  5. Getty-Sports
    Getty-Sports Mitglied
    Registriert seit:
    13. Dezember 2022
    Beiträge:
    14
    Zustimmungen:
    0
    Gegebene Danke:
    1
    Hallo,
    ich möchte es gerne in CSS ändern. Es gibt in der Bearbeitung vom Theme die folgende Option:

    upload_2023-1-10_15-28-29.png

    Unter diesem Punkt wollte ich es bearbeiten.
    Weiß du wie es geht?

    Ja, ich wollte es ist eine H1-Überschrift aber als Klasse wäre es dann auch recht gut, dann ändert man nicht gleich alle Seiten.

    Schöne Grüße
    Timo
     
  6. Getty-Sports
    Getty-Sports Mitglied
    Registriert seit:
    13. Dezember 2022
    Beiträge:
    14
    Zustimmungen:
    0
    Gegebene Danke:
    1
    Ob mit Punkt oder ohne... hat beides nicht funktioniert. Als Klasse wäre es auch nicht schlecht, da hast du recht. Wie macht man das?

    Schöne Grüße
    Timo
     
  7. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    5. Mai 2022
    Beiträge:
    2.927
    Zustimmungen:
    1.486
    Gegebene Danke:
    574
    Zeig mal deinen Shop und welche Überschrift du ändern willst.
     
  8. Anonymous
    Anonymous Erfahrener Benutzer
    Registriert seit:
    28. Dezember 2020
    Beiträge:
    444
    Zustimmungen:
    232
    Gegebene Danke:
    83
    Da schließe ich mich der Antwort von @Kai Stejuhn an, ohne Link zum Patienten und welche h1 du genau ändern willst, kann ich dir schlecht helfen.
     
  9. Getty-Sports
    Getty-Sports Mitglied
    Registriert seit:
    13. Dezember 2022
    Beiträge:
    14
    Zustimmungen:
    0
    Gegebene Danke:
    1
    Der Shop ist hier zu finden...

    (Link nur für registrierte Nutzer sichtbar.)

    Wir möchten ganz gerne diese Überschrift ändern:

    GETTY-SPORTS - TURNANZÜGE MADE IN GERMANY

    Das hat bisher noch nicht funktioniert mit Gerds Vorschlägen.

    Schöne Grüße
    Timo
     
  10. Dominik Späte
    Dominik Späte Erfahrener Benutzer
    Registriert seit:
    16. Oktober 2018
    Beiträge:
    1.251
    Zustimmungen:
    1.146
    Gegebene Danke:
    391
    Code:
    body.page-index #main h1.text-left{
      text-align: left;
    }
    
    body.page-index #main h1.text-left::after{
      background-color: transparent;
    }
    
     
  11. Getty-Sports
    Getty-Sports Mitglied
    Registriert seit:
    13. Dezember 2022
    Beiträge:
    14
    Zustimmungen:
    0
    Gegebene Danke:
    1
    Super, vielen Dank! Das hat funktioniert.
    Wo findet man die Klassen "body.page-index #main h1.text-left" oder "body.page-index #main h1.text-left::after" ?