HTML erklärt #10 Breiten und Höhen

geschrieben von Felix Beuster am 29.08.2010

Dein Browser ist zu klein für den eingebetteten Player. Du kannst das Video hier auf YouTube ansehen.

Hier wird euch gezeigt, wie ihr Absätze (oder jedes andere Element) in der Breite oder Höhe verändern könnt.
Neue Attribute in diesem Teil: width, height

1
2<!DOCTYPE html>
3<html>
4 <head>
5  <title>Breiten und Höhen</title>
6  <meta charset="utf-8">
7  <meta http-equiv="content-type" content="text/html; charset=utf-8">
8  <style>
9   html, body {height: 100%;}
10   body {font-family: Calibri; background-color: #cccccc;}
11   p {background-color: #ff9900;}
12   .p100p {width: 100%;}
13   .p100px {width: 100px;}
14   .p50p {width: 50%;}
15   .p100h {height: 100px;}
16   .p10hp {height: 10%;}
17  </style>
18 </head>
19 <body>
20  <p class="p100p">Lorem ipsum dolor sit amet.</p>
21  <p class="p100px">Lorem ipsum dolor sit amet.</p>
22  <p class="p50p">Lorem ipsum dolor sit amet.</p>
23  <p class="p100h">Lorem ipsum dolor sit amet.</p>
24  <p class="p10hp">Lorem ipsum dolor sit amet.</p>
25 </body>
26</html>

< Zurück zu HTML erklärt

Mehr aus HTML erklärt

HTML erklärt #11 RGB-Farben

Hier klicken, um das Video zu sehen. Heute habe ich für euch eine kurze Erklärung zu RGB-Farben, mit ein paar Beispielen. Diesmal reine Theorie und keine Arbeit im Code.

HTML erklärt #4 Bilder einfügen

Hier klicken, um das Video zu sehen. Diesmal lernt ihr, wie ihr schnell Bilder mit HTML in Internetseiten einfügt. Neue Tag in diesem Teil: imgHier klicken, um den Quellcode zu sehen.

HTML erklärt #7.1 Tabellen erstellen

Hier klicken, um das Video zu sehen. Dies ist das erste Tabellenvideo meiner Reihe, es kommen bestimmt noch andere. Hier zeige ich einfach Basics der Tabelle, quasi nur das Grundgerüst und ein wenig Inhalt. Weitere Video zu...

HTML erklärt #3 Makros in Notepad++

Hier klicken, um das Video zu sehen. Mit diesem kleinen Tipp zeige ich euch, wie ihr mit ein paar Mausklicks oft wiederholte Eingaben fast schon automatisieren könnt und dadurch viel Zeit spart.

< Zurück zu HTML erklärt

Kommentare

Bisher keine Kommentare.

Bitt warte 20 Sekunden, bevor du das Formular abschicken kannst.

< Zurück zu HTML erklärt

Ein parr mehr Artikel

console.log - Developer Notes 10.11.2017

Einmal die Woche gibt es hier Updates und Hintergrundinfos zu meinen Open Source Projekten. Diese Woche zur Android App Abfall LRO. Abfall LRO Die Arbeit...

Übersicht und Feed - 2 Tipps ans videoamt (Videoantwort) - YouTube Lupe #37

Hier klicken, um das Video zu sehen. Auf zwei kleine Probleme, angesprochen vom JoCognito vom videoamt, hier passende Tipps dazu. JoCognito's Video...

Werkstatt 2.0

Nein, es gibt kein neues Tool. Aber ich bin ganz fleißig am arbeiten an einem Update für be|namer. Es gibt einiges zu ändern, unter anderem viel Bugfixing. Release ist am 18.03. Abends. Aber bis dahin wird noch gearbeitet. :) Aber was ist noch zu...

100 Stunden die Minute - 8 Jahre YouTube

Bereits Mitte Februar des Jahres habe ich prognostiziert, dass es auf YouTube einen Upload von über 100 Stunden Video in der Minute gibt. Jetzt knapp drei Monate...

< Zurück zu HTML erklärt