CSS background-position প্রোপার্টি দিয়ে ব্যাকগ্রাউন্ড ইমেজের শুরুর অবস্থান নির্ধারণ করা

background-position প্রোপার্টি দিয়ে ব্যাকগ্রাউন্ড ইমেজের কোথা থেকে শুরু হবে তা নির্ধারণ করা হয়। মান দিতে হয়: <position> <position> (X Y)। কীওয়ার্ড: left, center, right, top, bottom। লেথ ইউনিট বা পার্সেন্টেজও ব্যবহার করা যায়।

উদাহরণ ১: left center (বামে, মাঝপথে)

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-image: url("https://www.tutorialspoint.com/images/Swift.png");
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: blue;
  background-position: left center;
}
.demo { text-decoration: overline underline; }
</style>
</head>
<body>
<h1>Details</h1>
<p class="demo">Examination Center near ABC College.</p>
<p class="demo2">Exam begins at 9AM.</p>
</body>
</html>

উদাহরণ ২: 50% 50% (একদম মাঝপথে)

<!DOCTYPE html>
<html>
<head>
<style>
body {
  background-image: url("https://www.tutorialspoint.com/images/Swift.png");
  background-repeat: no-repeat;
  background-attachment: fixed;
  color: blue;
  background-position: 50% 50%;
}
</style>
</head>
<body>
<h1>Details</h1>
<p>Examination Center near ABC College.</p>
<p>Exam begins at 9AM.</p>
</body>
</html>

টিপ: background-position: right 20px bottom 10px; এর মতো চतुর্দিক থেকে অফসেট দেয়া যায় (CSS Backgrounds Level 4)।