Teil 2: Figuren gestalten mit CSS – Dreiecke

---

Dass man mit CSS nicht nur Schriften einfärben und Hintergründe definieren kann, das ist weitgehend bekannt. Was aber wirklich mit CSS möglich ist, das ist noch nicht sonderlich gut aufgezeigt. Daher haben wir uns dazu entschlossen, hier einige Tipps und Tricks zu geben, wie wir mit CSS gestalten können und uns kreativ austoben können.

Im ersten Teil berichteten wir über die Grundformen wie Quadrate, Rechtecke, Kreise und Ovale. Im zweiten Teil gehen wir nun auf die Gestaltung von Dreiecken näher ein. Ausgangslage ist für uns immer ein Container <div class="?"></div> mit dem jeweiligen Klassennamen (zum Beispiel#dreieck) im unteren Kasten.

Dreieck oben

• Figur
• CSS-Code

Dreieck unten

• Figur
• CSS-Code

Dreieck links

• Figur
• CSS-Code

Dreieck rechts

• Figur
• CSS-Code

Dreieck links oben

• Figur
• CSS-Code

Dreieck rechts oben

• Figur
• CSS-Code

Dreieck links unten

• Figur
• CSS-Code

Dreieck rechts unten

• Figur
• CSS-Code

In Teil drei werden wir dann auf die Mehreckkörper genauer eingehen. Fünfecke, Sechsecke, Sterne, etc. All das ist kein Problem mit CSS. Lassen Sie sich überraschen.

Lesen Sie hierzu auch:

• Teil 1: die Grundformen
• Teil 2: Dreiecke