CSS ব্যাকগ্রাউন্ড অ্যাটাচমেন্ট

CSS Background Attachment দিয়ে যাকগ্রাউন্ড ইমেজ স্থির করা যায় ।

background-attachment প্রপার্টি নির্দিষ্ট করে যে ব্যাকগ্রাউন্ড ইমেজটি স্ক্রোল করা উচিত নাকি ঠিক  স্থির থাকা উচিত।

সাধারন ভাবে ব্যাকগ্রাউন্ড ইমেজ ডকুমেন্টের সাথে স্ক্রোল করে উপরে বা নিচে চলে যায় টেক্সট বা অন্য এলিমেন্ট গুলোর সাথে ।

কিন্তু background-attachment প্রপার্টি ব্যবহার করে ব্যাকগ্রাউন্ড ইমেজকে স্থির করে রাখা যায় ।

উদাহরন

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
body {
background-image: url('cup-of-tea.jpg');
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
}
body { background-image: url('cup-of-tea.jpg'); background-repeat: no-repeat; background-position: center; background-attachment: fixed; }
body {
  background-image: url('cup-of-tea.jpg'); 
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
}

নিজে চেষ্টা করুন

CSS Background Attachment এর ডিফল্ট ভেলু scroll

যদি আগে থেকে কোন সিএসএস ব্যাকগ্রাউন্ড ইমেজে background-attachment fixed থাকে, সেটিকে ওভার রাইট করতে পারেন নিচের মতো করে ।

Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
body {
background-image: url('cup-of-tea.jpg');
background-repeat: no-repeat;
background-position: right top;
background-attachment: scroll;
}
body { background-image: url('cup-of-tea.jpg'); background-repeat: no-repeat; background-position: right top; background-attachment: scroll; }
body {
  background-image: url('cup-of-tea.jpg');
  background-repeat: no-repeat;
  background-position: right top;
  background-attachment: scroll;
}

কমেন্ট করুন

Your email address will not be published. Required fields are marked *