x
1
2
<html>3
<head>4
<style>5
img.a {6
vertical-align: baseline;7
}8
9
img.b {10
vertical-align: text-top;11
}12
13
img.c {14
vertical-align: text-bottom;15
}16
17
img.d {18
vertical-align: sub;19
}20
21
img.e {22
vertical-align: super;23
}24
</style>25
</head>26
<body>27
28
<h1>The vertical-align</h1>29
30
<p>An <img class="a" src="https://www.closetag.com/images/sqpurple.gif" width="9" height="9"> image with a default alignment.</p> 31
32
<h2>vertical-align: text-top:</h2>33
<p>An <img class="b" src="https://www.closetag.com/images/sqpurple.gif" width="9" height="9"> image with a text-top alignment.</p> 34
35
<h2>vertical-align: text-bottom:</h2>36
<p>An <img class="c" src="https://www.closetag.com/images/sqpurple.gif" width="9" height="9"> image with a text-bottom alignment.</p>37
38
<h2>vertical-align: sub:</h2>39
<p>An <img class="d" src="https://www.closetag.com/images/sqpurple.gif" width="9" height="9"> image with a sub alignment.</p> 40
41
<h2>vertical-align: sup:</h2>42
<p>An <img class="e" src="https://www.closetag.com/images/sqpurple.gif" width="9" height="9"> image with a super alignment.</p>43
44
</body>45
</html>