> For the complete documentation index, see [llms.txt](https://wiki.themeware.design/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://wiki.themeware.design/wissensdatenbank/anleitungen/individuelle-anpassungen/css-hierarchie.md).

# CSS-Hierarchie

Du kannst die CSS-Hierarchie beim Überschreiben von CSS/SCSS-Anweisungen ganz einfach mit der "Body-Klasse" in der ThemeWare® Konfiguration beeinflussen. Dadurch kannst du unschöne `!important` Anweisungen vermeiden.

* **Body-Klasse**: Tab "Weiteres" => Bereich "Experten-Einstellungen" => Abschnitt "Individuelle CSS-Klasse"

Trage hier beispielsweise "meinshop" ein und stelle dies an den Anfang des entsprechenden CSS/SCSS-Selektors.

#### CSS

```css
// Vorher
.product-detail-ordernumber-container .product-detail-ordernumber-label {
    font-weight: 300 !important; 
}

// Besser
.meinshop .product-detail-ordernumber-container .product-detail-ordernumber-label {
    font-weight: 300; 
}
```

#### SCSS

```scss
// Before
.product-detail-ordernumber-container {
    .product-detail-ordernumber-label {
        font-weight: 300 !important;
    }
}

// Better
.meinshop {
    .product-detail-ordernumber-container {
        .product-detail-ordernumber-label {
            font-weight: 300;
        }
    }
}
```
