বৈশিষ্ট্য border-image-outset

বৈশিষ্ট্য border-image-outset এলিমেন্টের সীমানাকে এর সীমানার বাইরে সরানোর অনুমতি দেয়। মান হিসাবে পরিমাপের একক উল্লেখ না করে একটি সংখ্যা অথবা শতাংশ ছাড়া আকারের যেকোনো একক উল্লেখ করা হয়। যদি একক ছাড়া একটি সংখ্যা উল্লেখ করা হয়, তবে এটি একটি গুণক, যা border-width বৈশিষ্ট্যের মান দ্বারা গুণ করা হয়। নেতিবাচক মান সমর্থিত নয়।

সীমানার ছবি সম্পর্কে আরও বিস্তারিত তথ্যের জন্য border-image বৈশিষ্ট্য দেখুন।

সিনট্যাক্স

cssসিলেক্টর {
  border-image-outset: ধনাত্মক সংখ্যা;
}

উদাহরণ . সংখ্যা

এলিমেন্টে মাউস নেওয়ার সময় border-image-outset এর মান 3 সেট করি। এক্ষেত্রে সীমানা 26px*3 - border-width-এ নির্ধারিত এর প্রস্থের চেয়ে 3 গুণ দূরে সরে যাবে:

html<div id="elem"></div>

css#elem:hover {
  border-image-outset: 3;
}
#elem {
  border-image-repeat: repeat;
  border-image-source: url("image.png");
  border-image-slice: 26;
  border-style: solid;
  border-width: 26px;
  width: 200px;
  height: 200px;
  background: green;
  margin: 100px auto;
}

Результат:

উদাহরণ . পিক্সেল

এলিমেন্টে মাউস নেওয়ার সময় border-image-outset এর মান 30px সেট করি। এক্ষেত্রে সীমানা 30px সরে যাবে:

html<div id="elem"></div>

css#elem:hover {
  border-image-outset: 30px;
}
#elem {
  border-image-repeat: repeat;
  border-image-source: url("image.png");
  border-image-slice: 26;
  border-style: solid;
  border-width: 26px;
  width: 200px;
  height: 200px;
  background: green;
  margin: 50px auto;
}

Результат:

আরও দেখুন