Auf dieser Seite findest Du Lernmaterialien für HTML/CSS. Du kannst auch über die Startseite direkt Online Nachhilfe HTML/CSS buchen.
HTML (Hypertext Markup Language) und CSS (Cascading Style Sheets) sind zwei grundlegende Technologien, die für die Gestaltung und Darstellung von Inhalten im Web verwendet werden. Hier ist eine grundlegende Erklärung jeder Sprache:
HTML (Hypertext Markup Language):
- Zweck: HTML ist eine Auszeichnungssprache, die verwendet wird, um die Struktur und den Inhalt von Webseiten zu definieren. Es ermöglicht, verschiedene Teile einer Webseite zu kennzeichnen, indem Tags verwendet werden.
- Tags: HTML verwendet Tags, die von spitzen Klammern (<>) umgeben sind, um Elemente zu markieren. Einige grundlegende Tags sind
<html>
,<head>
,<title>
,<body>
,<p>
,<h1>
bis<h6>
,<a>
(für Links),<img>
(für Bilder), usw. - Struktur: Eine HTML-Seite hat eine grundlegende Struktur, beginnend mit dem
<html>
-Tag, gefolgt vom<head>
-Tag (für Metadaten wie Titel und Verknüpfungen zu externen Ressourcen) und dem<body>
-Tag (für den Hauptinhalt der Seite). - Beispiel:
<html>
<head>
<title>Meine Webseite</title>
</head>
<body>
<h1>Willkommen auf meiner Webseite</h1>
<p>Dies ist ein Absatz mit Text.</p>
<img src="bild.jpg" alt="Ein Beispielbild">
<a href="https://www.example.com">Besuche Beispiel</a>
</body>
</html>
CSS
CSS (Cascading Style Sheets):
- Zweck: CSS ist eine Stylesheet-Sprache, die verwendet wird, um das Aussehen und Layout von HTML-Dokumenten zu gestalten. Mit CSS können Entwickler das Erscheinungsbild von Elementen wie Text, Farben, Abständen und Positionen steuern.
- Selektoren und Deklarationen: CSS verwendet Selektoren, um HTML-Elemente auszuwählen, und Deklarationen, um zu definieren, wie diese Elemente formatiert werden sollen. Deklarationen bestehen aus Eigenschaften und Werten.
- Einbindung in HTML: CSS kann direkt in HTML-Dokumente eingebettet werden, in einer separaten CSS-Datei gespeichert oder inline mit einzelnen HTML-Elementen verwendet werden.
- Beispiel:<!DOCTYPE html>
<html>
<head>
<title>Meine Gestylte Webseite</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f2f2f2;
}
h1 {
color: #0066cc;
}
p {
margin: 20px;
}
</style>
</head>
<body>
<h1>Stylische Überschrift</h1>
<p>Dieser Text hat einen Abstand von 20 Pixeln.</p>
</body>
</html>
In diesem Beispiel wird der Text auf der Webseite durch HTML strukturiert, während CSS für die Gestaltung und das Layout verantwortlich ist. Die Trennung von Inhalt (HTML) und Darstellung (CSS) erleichtert die Wartung und Aktualisierung von Webseiten.
Lernmaterialien HTML/CSS – Online Nachhilfe HTML/CSS
Dieses PDF enthält eine Aufgabe zum Thema Layout mit HTML/CSS
PDF: Layout mit HTML und CSS
PDF: ASPX-HTML-WCF
PDF: ASPX Application