Border-image-outset հատկությունը
border-image-outset հատկությունը թույլ է տալիս
տեղաշարժել եզրագիծը տարրի սահմաններից դուրս: Որպես
արժեք նշվում է թիվ՝ չափման միավորներ չնշելով,
կամ ցանկացած չափերի
միավոր, բացի տոկոսներից: Եթե նշված է
թիվ՝ առանց միավորների, ապա այն բազմապատկիչ է,
որով բազմապատկվում է border-width
հատկության արժեքը:
Բացասական արժեքներ չեն աջակցվում:
Եզրագծի համար նախատեսված պատկերների մասին ավելի մանրամասն
տեղեկությունների համար տես border-image
հատկությունը:
Շարահյուսություն
ընտրող {
border-image-outset: դրական թիվ;
}
Օրինակ . Թիվ
Մկնիկի թրթիռի դեպքում տարրի համար սահմանենք border-image-outset
հատկության արժեքը 3:
Այս դեպքում եզրագիծը կտեղաշարժվի 26px*3 -
3 անգամ ավելի հեռու, քան border-width-ում
սահմանված դրա լայնությունն է:
<div id="elem"></div>
#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:
<div id="elem"></div>
#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;
}
:
Տես նաև
-
border-imageհատկությունը,
որը պատկեր-եզրագծի համար հապավում է -
border-image-sourceհատկությունը,
որը նշում է եզրագծի համար պատկերի ուղին -
border-image-sliceհատկությունը,
որը եզրագծի համար պատկերի բաժանումն է -
border-image-repeatհատկությունը,
որը եզրագծի համար պատկերի կրկնությունն է -
border-image-widthհատկությունը,
որը նշում է եզրագծի համար պատկերի չափը