background-position.aspx font size:
<html>
<head>
<title>Abakada CSS Demo: background-position Attribute</title>
<link href="../shared/demos_blk.css" rel="stylesheet" type="text/css">

<style type="text/css">
<!--
   body {
      background: url( "../shared/images/back.jpg" )
      no-repeat center }
   .topLeft {
      background-position: "top left" }
   .bottomRight {
      background-position: "bottom right" }
-->
</style>
</head>

<body id="theBody">
<!-- #include virtual="~/shared/top.inc" -->

<div class="header"><h2>Abakada CSS Demo: <span class="hilite">background-position</span> Attribute</h2></div>
<hr size=1 width=92%>

<center>
   <div id="msg" onmouseover="theBody.className='topLeft'"
      onclick="theBody.className='bottomRight'" onmouseout="theBody.className=''">

      <p>This example uses calls to an embedded stylesheet to dynamically set an element's <b>background-position</b> style attribute. </p>

      <p>The background image on the BODY is initially set at <i>center</i>. </p>

      <p>Move the mouse over this text to apply a style class that sets the position of the image to <i>top left</i>. </p>

      <p>Click to move <i>bottom right</i>. Move the mouse out to reset. </p>

   </div>
</center>

<hr size=1 width=92%>
<!-- #include virtual="~/shared/viewsrc.inc" -->

</body>