Can anyone explain the border-image-slice feature to me?

Question

/* All sides */
border-image-slice: 30%;

/* vertical | horizontal */
border-image-slice: 10% 30%;

/* top | horizontal | bottom */
border-image-slice: 30 30% 45;

/* top | right | bottom | left */
border-image-slice: 7 12 14 5;

/* Using the `fill` keyword */
border-image-slice: 10% fill 7 12;

/* Global values */
border-image-slice: inherit;
border-image-slice: initial;
border-image-slice: unset;

Answer 1

https://developer.mozilla.org/en-US/docs/Web/CSS/border-image-slice

Answer 2

There is nothing wrong with trying different resources if one resource isn't explaining things in a way that you may understand.

https://css-tricks.com/understanding-border-image/
https://tympanus.net/codrops/css_reference/border-image-slice/

Google search for more If these still don't help.