border-image-outset ගුණය

border-image-outset ගුණය මූලද්‍රව්‍යයෙන් පිටතට සීමාව ගෙන යාමට ඉඩ සලසයි. අගයක් ලෙස මිනුම් ඒකක නොදක්වන අංකයක් හෝ කිසියම් ප්‍රමාණ සඳහා ඒකක, සියයට හැරුණු විට. ඒකක නොමැතිව අංකයක් දක්වා තිබේ නම්, එය ගුණකයකි, එය border-width ගුණයේ අගයන් ගුණ කරනු ලබන. ඍණ අගයන් සහාය නොදක්වයි.

සීමාව සඳහා පින්තූර පිළිබඳ වැඩි විස්තර සඳහා border-image ගුණය බලන්න.

වාක්‍ය රචනය

cssතෝරන්නා {
  border-image-outset: ධන අංකය;
}

නිදසුන . අංකය

border-image-outset අගය 3 ලෙස මූසිකය මූලද්‍රව්‍යය මත ගෙන යන විට සකසමු. මෙමගින් සීමාව 26px*3 - එනම් 3 ගුණයක් දුරින්, border-width හි සකසා ඇති එහි පළලට වඩා ගෙන යනු ඇත:

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;
}

Результат:

මෙයද බලන්න