CSS inset প্রতিশব্দ
- পূর্ববর্তী পৃষ্ঠা inline-size
- পরবর্তী পৃষ্ঠা inset-block
পরিভাষা ও ব্যবহার
inset প্রতিভা ব্যবহার করে এলিমেন্টটি এবং তার পিতৃ এলিমেন্টের মধ্যে দূরত্ব নির্ধারণ করা হয়。
নোট:এই বৈশিষ্ট্যটি কার্যকরী করতে, নির্দিষ্ট করা উচিত পোজিশন বৈশিষ্ট্য
inset এই বৈশিষ্ট্যটি নিম্নলিখিত বৈশিষ্ট্যগুলির সংক্ষিপ্ত রূপ
inset বৈশিষ্ট্যের মানটি বিভিন্ন পদ্ধতিতে নির্ধারিত করা যেতে পারে:
যদি inset বৈশিষ্ট্যটির চারটি মান থাকে:
inset: 15px 30px 60px 90px;
- উপরের দূরত্ব 15 পিক্সেল
- ডানের দূরত্ব 30 পিক্সেল
- নীচের দূরত্ব 60 পিক্সেল
- বামের দূরত্ব 90 পিক্সেল
যদি inset বৈশিষ্ট্যটির তিনটি মান থাকে:
inset: 15px 30px 60px;
- উপরের দূরত্ব 15 পিক্সেল
- বাম-ডান দূরত্ব 30 পিক্সেল
- নীচের দূরত্ব 60 পিক্সেল
যদি inset বৈশিষ্ট্যটির দুটি মান থাকে:
inset: 15px 30px;
- উপর-নীচে দূরত্ব 15 পিক্সেল
- বাম-ডান দূরত্ব 30 পিক্সেল
যদি inset বৈশিষ্ট্যটির একটি মান থাকে:
inset: 10px;
- চারটি দিকের দূরত্বই 10 পিক্সেল
উদাহরণ
উদাহরণ 1
স্থানান্তর করার <div> ইলেকট্রনিকের থেকে পারেন্ট ইলেকট্রনিকের দূরত্ব নির্দিষ্ট করা হয়:
div {
inset: 35px;
}
উদাহরণ 2
ডিভ ইলেকট্রনিকের inset প্রতিটি বৈশিষ্ট্যকে পারেন্ট ইলেকট্রনিকের থেকে সমান দূরত্বে নির্দিষ্ট করা হয়: 15 পিক্সেল (উপর), 15 পিক্সেল (নীচে), 30 পিক্সেল (বাম), 30 পিক্সেল (ডান):
div {
inset: 15px 30px;
}
উদাহরণ 3
ডিভ ইলেকট্রনিকের inset প্রতিটি বৈশিষ্ট্যকে পারেন্ট ইলেকট্রনিকের থেকে সমান দূরত্বে নির্দিষ্ট করা হয়: 15 পিক্সেল (উপর), 30 পিক্সেল (বাম), 30 পিক্সেল (ডান), 60 পিক্সেল (নীচে):
div {
inset: 15px 30px 60px;
}
উদাহরণ 4
ডিভ ইলেকট্রনিকের inset প্রতিটি বৈশিষ্ট্যকে পারেন্ট ইলেকট্রনিকের থেকে সমান দূরত্বে নির্দিষ্ট করা হয়: 15 পিক্সেল (উপর), 30 পিক্সেল (ডান), 60 পিক্সেল (নীচে), 90 পিক্সেল (বাম):
div {
inset: 15px 30px 60px 90px;
}
সিএসএস গঠন
inset: auto|length|ইনিশিয়াল|ইনহারিট;
বৈশিষ্ট্য মান
| মান | বর্ণনা |
|---|---|
| অটো | ডিফল্ট মান |
| length | স্থায়ী ইউনিট (যেমন px, pt, cm ইত্যাদি) দ্বারা দূরত্ব নির্দিষ্ট করেন।নেগাটিভ মানও অনুমোদিত হয়।দেখুনCSS ইউনিট. |
| % | পারসেন্টেজে দূরত্ব নির্দিষ্ট করেন, যা পারেন্ট ইলেকট্রনিকের অনুরূপ আকারের প্রতিযোগী অক্ষের সাথে সম্পর্কিত |
| ইনিশিয়াল | এই বৈশিষ্ট্যটিকে তার ডিফল্ট মানে সমায়োজিত করা হয়।দেখুন ইনিশিয়াল. |
| ইনহারিট | এই বৈশিষ্ট্যটি পারেন্ট ইলেকট্রনিকের থেকে ইনহারিট করা হয়।দেখুন ইনহারিট. |
টেকনিক্যাল বিবরণ
| ডিফল্ট মান: | অটো |
|---|---|
| প্রক্রিয়াকরণ: | না |
| অ্যানিমেশন নির্মাণ: | সমর্থন করা হয়েছে।দেখুন:অ্যানিমেশন-সংক্রান্ত বৈশিষ্ট্য. |
| সংস্করণ: | সিএসএস ৩ |
| জেভাস্ক্রিপ্ট গঠন | object.style.inset="100px 50px" |
ব্রাউজার সমর্থন
টেবিলের সংখ্যা এই লক্ষ্যকে সম্পূর্ণরূপে সমর্থনকারী ব্রাউজারের সংস্করণকে ইনডিকেট করে
| চ্রোম | এজ | ফায়ারফক্স | সাফারি | অপেরা |
|---|---|---|---|---|
| 87.0 | 87.0 | 66.0 | 14.1 | 73.0 |
সংশ্লিষ্ট পৃষ্ঠা
শিক্ষাদত্ত্ব:CSS অবস্থান
উল্লেখ:CSS position প্রক্রিয়া
উল্লেখ:CSS bottom প্রতিশব্দ
উল্লেখ:CSS left প্রতিশব্দ
উল্লেখ:CSS right প্রক্রিয়া
উল্লেখ:CSS top অপারেটর
- পূর্ববর্তী পৃষ্ঠা inline-size
- পরবর্তী পৃষ্ঠা inset-block
