Die 3 Möglichkeiten CSS in HTML einzubinden

in den <head> Tag direkt mit<style>deine Stylesheets hier z.B p{font-size: 18px;}</style></head>

Verwendung:
Bei nur einer Seite mit wenigen Styles, damit die Übersicht und Einordnung des Seitenbereiches der Styles ohne großes Scrollen möglich ist im <head> Tag
<link rel=“stylesheet“ href=“layout.css“>
Zum Einbinden von externen Stylesheets

Verwendung:
Viele Styles für verschiedene Bereiche der Seite. So lassen sich die Styles schön den Bereichen zuordnen.

3. direkt in ein Tag: <div id=”…” style=”deine Stylesheets”> (wenn es schnell gehen soll zum testen z.B)

Beispiel zu css im head:

...
<head>
...
<title>Der Titel</title>
<style>
p{
    font-size: 18px;
}
</style>
</head>

Beispiel zu css verlinkt:

...
<head>
<link rel="stylesheet" href="layout.css">
</head>

Beispiel zu inline-css:

<p style="color: red">Mein Paragraph Inhalt</p>

Referenz Links:

Webhomeschool