সিএসএস ব্যাকগ্রাউন্ড পজিশন ব্যবহার করে ওয়েব এলিমন্ট গুলোকে সুন্দর করে সাজানো যায় ।
css background-position প্রপার্টি ব্যাকগ্রাউন্ড ইমেজের অবস্থান নির্দিষ্ট করতে ব্যবহৃত হয়।
উদাহরন
ব্যাকগ্রাউন্ড ইমেজটিকে উপরের-ডান কোণায় রাখুন:
body {
background-image: url("img_tree.png");
background-repeat: no-repeat;
background-position: right top;
}
body {
background-image: url("img_tree.png");
background-repeat: no-repeat;
background-position: right top;
}
body {
background-image: url("img_tree.png");
background-repeat: no-repeat;
background-position: right top;
}CSS background-position এর ভেলু গুলো হয় center, left top, left bottom, right top, right bottom, % ও px আকারে ।
ডিফল্ট ভাবে একটি left top এ থাকে এবং px এর ক্ষেত্রে left top থেকে x ও y এক্সিস বরাবর সরতে থাকে ।
উদাহরন
background-position: 210px 50px;
background-position: 210px 50px;
background-position: 210px 50px;
পরের টিউরোরিয়াল গুলো দেখতে থাকুন । সিএসএস ব্যাকগ্রাউন্ড দিয়ে অনকে সুন্দর ডিজাইন করা যায় যার একটি ভিডিও টিউরোরিয়াল দেবো সিএসএস ব্যাকগ্রাউন্ড টিউটোরিয়াল গুলোর শেষে।
CSS Syntax
background-position: value;
background-position: value;
background-position: value;
Property Values
| ভেলু | বর্ণনা |
| left top left center left bottom right top right center right bottom center top center center center bottom | যদি শুধু একটি ভেলু দেয়া হয়, তাহলে অপর টি center হবে |
| x% y% | 0% 0% থেকে 100% 100% পর্যন্ত হয় এবং ডানের উপর কোনা থেকে শুরু হয়। |
| x px y px | এক্ষেত্রে ও 0px 0px থেকে 100px 100px পর্যন্ত হয় এবং ডানের উপর কোনা থেকে শুরু হয়। |
| initial | Default ভেলু তে নিয়ে যায় । বিস্তারিত দেখুন CSS Initial |
| inherit | পেরেন্ট এলিমেন্ট থেকে ভেলু নেয় । |