HTML&CSS #2

In diesem 2. Beitrag meiner HTML&CSS Reihe werde ich euch ein paar Formatierungen für euren Text zeigen und wir ihr Bilder in eure Webseite einbinden könnt. Am Ende gibt es noch eine ganz kurze Umfrage. Los geht's!

Ein Beitrag von Galaxy.09 7. April 2021

2 Kommentare

1344

Um Text fett/dick erscheinen zu lassen müsst ihr den entsprechenden Text zwischen <b> und </b> schreiben.

Für kursiven Text müsst ihr den entsprechenden Text zwischen <i> und </i> schreiben.

Für Überschriften müsst ihr je nach dem wie groß der Text sein muss in <h(1)> und </h(1)>. Natürlich lasst ihr die Klammern () weg. Desto größer der Text erscheinen soll müsst ihr eine kleine Zahl hinein schreiben und desto kleiner der Text sein soll muss die Zahl größer sein. Allerdings kann man nur eine Zahl zwischen 1 und 6 benutzen. Das heißt für die größte Überschrift benutzt ihr den Befehl <h1> </h1>. Für die kleinste Überschrift, die kleiner ist als der normale Text benutzt ihr den Befehl <h6> </h6>.

Um Bilder in eure Seite einzubinden müsst ihr den Befehl <img src="Dateipfad" width="breite angeben" height="höhe angeben">. Dieser Befehl muss nicht beendet werden. Um den Dateipfad eines Bildes zu bekommen wählt ihr dieses im Explorer aus (Nur einmal darufklicken) und klickt dann auf Pfad kopieren (oben unter start).

Hier noch ein bisschen Quellcode zum ausprobieren:😉

<!DOCTYPE html>

<html>

<head>

<title>Bilder und Formatierungen</title>

</head>

<body>

<h1> Titel </h1>

<br>

<b>Lorem ipsum</b> <i>dolor sit amet</i>, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam

</body>

</html>

Dein einzigen Befehl, den ihr hier noch nicht kennt ist <br> . Mit <br> macht ihr einen Zeilenumbruch.

Im Browser sollte Lorem ipsum fett erscheinen und dolor sit amet kursiv.

<img src="Bild" width="227" height="200"> Dies ist nur ein Beispiel. Die höhe und die breite könnt ihr auch anders angeben. Dies ist nur ein Beispiel und passt nicht auf alle Bilder. "Bild" müsst ihr natürlich noch durch den richtigen Pfad ersetzen.

Nun jetzt sind wir schon am Ende dieses Beitrages angekommen. Ich hoffe ihr habt alles verstanden. Falls ihr noch fragen habt schreibt in die Kommentare. Hier noch kurz ein Umfrage: