dummy.html
2.24 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Die Eigenschaft vertical-align</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<style type="text/css">
.test { line-height: 2; font-size: 4em;}
.test span {font-size: 0.3em;}
.baseline {vertical-align: baseline;}
.middle {vertical-align: middle;}
.sub {vertical-align: super;}
.text-top {vertical-align: text-top;}
.text-bottom {vertical-align: text-bottom;}
.percentage {vertical-align: 30%; }
.length {vertical-align: 30px;}
.top {vertical-align: top;}
.bottom {vertical-align: bottom;}
td {height:150px; }
</style>
</head>
<body>
<div class="test" style="border: 1px solid black">Gq
<span class="baseline">baseline</span>
<span class="middle">middle</span>
<span class="sub">sub</span>
<span class="super">super</span>
<span class="text-top">text-top</span>
<span class="text-bottom">text-bottom</span>
<span class="percentage">30%</span>
<span class="length">30px</span>
<span class="top">top</span>
<span class="bottom">bottom</span>
</div>
<div style="border: 1px solid black">
<img src="testbild.jpg" alt="testbild" width="50" eight="150">
<span class="baseline">baseline</span>
<span class="middle">middle</span>
<span class="sub">sub</span>
<span class="super">super</span>
<span class="text-top">text-top</span>
<span class="text-bottom">text-bottom</span>
<span class="percentage">30%</span>
<span class="length">30px</span>
<span class="top">top</span>
<span class="bottom">bottom</span>
</div>
<table style="border: 1px solid black">
<tr>
<td width="100">
<p>
Hier einfach mal ein wenig Text hin, um die Tabelle höher zu
bekommen. Und noch ein wenig Text, damit die Tabelle zur
Demonstration etwas höher wird.
</p>
</td>
<td class="baseline">baseline</td>
<td class="middle">middle</td>
<td class="percentage">30%</td>
<td class="length">30px</td>
<td class="top">top</td>
<td class="bottom">bottom</td>
</tr>
</table>
</body>
</html>