Das-Title-Tag
Teil des Abschnitts Styling mit CSS der HTML-Journey von Coddy. Lektion 5 von 76.
In HTML wird das title-Tag verwendet, um den Titel des HTML-Dokuments zu definieren. Dieser Titel wird in der Titelleiste des Browsers oder im Tab der Seite angezeigt. Das title-Tag wird innerhalb des <head>-Bereichs des HTML-Dokuments platziert.
Hier ist ein Beispiel dafür, wie du das title-Tag in einem HTML-Dokument verwendest:
<!DOCTYPE html>
<html>
<head>
<title>My Web Page</title>
<style>
body {
background-color: lightblue;
}
</style>
</head>
<body>
<h1>Welcome to My Page</h1>
<p>This is a paragraph of text.</p>
</body>
</html>In diesem Beispiel legt das title-Tag den Titel der Seite auf „My Web Page“ fest. Wenn du diese HTML-Datei in einem Browser öffnest, siehst du „My Web Page“ in der Titelleiste oder im Tab.
Aufgabe
EinfachGegeben ist ein HTML-Dokument. Füge dem HTML-Dokument einen Titel hinzu, der wie folgt lautet: My Cool CSS Page
Probier es selbst
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: lightblue;
}
</style>
</head>
<body>
<h1>Welcome to My Page</h1>
<p>This is a paragraph of text.</p>
</body>
</html>Diese Lektion enthält ein kurzes Quiz. Starte die Lektion, um es zu beantworten und deinen Fortschritt zu speichern.
Alle Lektionen in Styling mit CSS
4Textgrundlagen
TextfarbeSchriftfamilieSchriftgrößeSchriftstärkeTextausrichtungTextdekorationWiederholungsaufgabe Nr. 1Wiederholungsaufgabe Nr. 25Farben und Hintergründe
HintergrundfarbeHEX-FarbenRGB-FarbenTransparenz mit RGBAWiederholungs-Challenge #111Layout-Techniken
Block- vs. Inline-ElementeGrundlagen der PositionierungRelative PositionierungAbsolute PositionierungFixierte PositionierungGrundlagen von z-indexWiederholungs-Challenge14Letzte Herausforderungen
Elemente anordnenFilmlisteHochzeitseinladungskarteSchwebende Benachrichtigung3Grundlegende Selektoren
Einführung in SelektorenTypselektorKlassenselektorID-SelektorGruppenselektorenUniversalselektorAuswahl-Challenge9Flexbox
Was ist eine Flexbox?Flex-RichtungInhalte ausrichtenElemente ausrichtenDie perfekte ZentrierungFlexbox-Herausforderung12Grundlagen des Responsive Designs
Was ist Responsive Design?Viewport-Meta-TagFließende LayoutsViewport-EinheitenGrundlagen der Media QueriesFlexible BilderÜbe selbstständig: Web-Playground