Einbindung in html
logo5

3 Möglichkeiten der Einbindung

Unterschied css - style - externes css-File

Bei den verschiedenen Formatierungsbefehlen gibt es keinen Unterschied, jedoch die Implementierung ist unterschiedlich!

 

1. Will man Elemente der Seite mittels css formatieren kann man diese im head-Bereich einfügen, z.B. so:

<head>
<meta name="description" content="Free Web tutorial">
<meta name="keywords" content="HTML,CSS,">
<meta name="author" content="Stefan Jeschek">
<meta charset="UTF-8">
<title>html & css Vokabelheft</title>
<style type="text/css">
  body {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    width:900px;
    margin:10px auto;
    padding:0px;
    border:1px solid #999;
    border-radius:8px;
}
</style>

</head>

2. Man kann die Formatierung auch bei jedem Element direkt eingeben mittes style, das muss man dann aber bei jedem Element machen, eine sehr aufwendige Möglichkeit, z.B. so:

<head>
<meta name="description" content="Free Web tutorial">
<meta name="keywords" content="HTML,CSS,">
<meta name="author" content="Stefan Jeschek">
<meta charset="UTF-8">
<title>html & css Vokabelheft</title>
</head>
<body style="font-family: Verdana, Geneva, sans-serif;  font-size: 12px; width:900px;
margin:10px auto; padding:0px; border:1px solid #999; border-radius:8px;"
>
</body>

3. Die eleganteste und schnellste Möglichkeit ist das erstellen eines externen Stylesheets - css-Datei - , in der die Formatierungen aufgelistet sind. Diese muss mit den entsprechenden html-Seiten verlinkt werden, z.B. so:

<head>
<meta name="description" content="Free Web tutorial">
<meta name="keywords" content="HTML,CSS,">
<meta name="author" content="Stefan Jeschek">
<meta charset="UTF-8">
<title>html & css Vokabelheft</title>
<link href="/vokabel.css" rel="stylesheet" type="text/css" />
</head>