<html>
<head>
<title>Abakada HTML Demo: IMG align Attribute</title>
<link rel="stylesheet" href="/shared/netdemos.css">
</head>
<body>
<!-- #include virtual="~/shared/top.inc" -->
<div class="header"><h2>Abakada HTML Demo: IMG <span class="hilite">align</span> Attribute</h2></div>
<hr size=1 width=92%>
<center>
<div style="width:70%; text-align:center">
<h5>This example shows the effects of applying different values possible for the <b>align</b> attribute,
when used with the <b>IMG</b> element.</h5>
<p id="msg"><img id="theImg" src="../shared/images/earth.gif"
width=100 height=100 border=0 hspace=5 vspace=5>
Select from the options below to see how the attribute is applied.
</p>
<!-- The resulting HTML syntax is shown below. -->
<h5 id="theSyntax"><img src="sphere.jpg"></h5>
<p><b>Options</b> <select name="units" tabindex=1 onchange="chgProp ( this.value )">
<option value="">
<option value="absbottom">absbottom
<option value="absmiddle">absmiddle
<option value="baseline">baseline
<option value="bottom">bottom
<option value="left">left
<option value="middle">middle
<option value="right">right
<option value="texttop">texttop
<option value="top">top
</select></p>
<p><button onclick="reset ( )">Reset</button></p>
<script language="JavaScript">
<!--
function chgProp ( a ) {
theImg.align = a;
theSyntax.innerText = '<img src="sphere.jpg" align="' + a + '">';
}
function reset ( ) {
units.value = ""
theImg.align = "";
theSyntax.innerText = '<img src="sphere.jpg">';
}
//-->
</script>
<p class="note">NOTE: <b>align</b> defaults to the bottom of the object aligned with the baseline of the surrounding text when no alignment is specified. </p>
</div>
<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->
</body>
</html>