Autor dieser Seite
Alexander Pankart
Ich erstelle professionellle Websites und Online Shops, bin zertifizierter Suchmaschinenmarketing Experte (FH Salzburg), habe meinen Studienschwerpunkt „Neue Medien“ (Universität Salzburg) mit Auszeichnung abgeschlossen und bin von Google zertifizierter UX Designer, Digital Marketing und eCommerce Professional. Als Vater von 2 wundervollen Kindern ist mein Kaffeekonsum über dem Durchschnitt.
Inhaltsverzeichnis
Was sind Cascading Style Sheets (CSS)?
Eine reguläre Website besteht in der Regel aus HTML (Hypertext Markup Language) und CSS (Cascading Style Sheets). Wenn man weitere Funktionen möchte, dann wird meist mit JS (JavaScript) gearbeitet.
Mit der Hilfe von CSS können Überschriften, Texte oder andere Elemente gestaltet werden.
Extern eingebundenes CSS
Es gibt mehrere Möglichkeiten wie CSS eingebaut werden kann. Wird CSS extern eingebunden, dann lädt man die referenziert man die Datei von einer Datei aus. Folgendes könnte im <head> der Website stehen:
<link href="https://www.pankart.dev/code/css/stylesheet.css" rel="Stylesheet" type="text/css" />
Inline CSS
Im Gegensatz zu extern eingebundenem CSS wird bei Inline CSS keine externe Quelle verwendet, sondern man verwendet Teile des Stylesheets direkt im <head> der jeweiligen Seite:
<style> .img { display:block; max-width:100%; height:auto; } </style>
Schatten mit CSS erstellen
Wenn man eine Website oder einen Online Shop in Elementor erstellt, dann hat man die Möglichkeit mit CSS Schatten unter Elementen zu erstellen. Die Optionen sind hier jedoch stark eingeschränkt, weshalb ich hier auf CSS zurückgreife. So erhalten die von mir verwendeten Elemente vielschichtige Schatten, welche ein modernes Aussehen haben. Hier findest du ein Beispiel für den verwendeten CSS Code:
box-shadow:
3.4px 3.4px 3.4px rgba(0, 0, 0, 0.031),
8.7px 8.7px 8.7px rgba(0, 0, 0, 0.044),
17.7px 17.7px 17.7px rgba(0, 0, 0, 0.056),
36.5px 36.5px 36.5px rgba(0, 0, 0, 0.069),
100px 100px 100px rgba(0, 0, 0, 0.1)
;
Professionelles Webdesign aus Salzburg
Website Erstellung und Online Shop Erstellung mit Fokus auf UX, SEO und CRO. Mehr Wunschkunden, gesteigerte Umsätze und ideale BewerberInnen.