<!DOCTYPE html>
<html>
<head>
<title>CSS background-position property</title>
<style type="text/css">
.top {
background-position: top;
}
.left_top {
background-position: top left;
}
.percentage {
background-position: 50% 35%;
}
.pixel {
background-position: 15px 40px;
}
div {
background-image: url("../../images/refresh.png");
background-repeat: no-repeat;
border: 1px solid #000;
width: 300px;
height: 150px;
}
</style>
</head>
<body>
<h4><code>Background Position (top)</code></h4>
<div class="top"></div>
<h4><code>Background Position (left top)</code></h4>
<div class="left_top"></div>
<h4><code>Background Position (percentage)</code></h4>
<div class="percentage"></div>
<h4><code>Background Position (pixel)</code></h4>
<div class="pixel"></div>
</body>
</html>