Egenskaben border-image-outset

Egenskaben border-image-outset giver mulighed for at flytte rammen ud over elementets grænser. Som værdi angives et tal uden måleenheder eller enhver enhed for størrelser, bortset fra procenter. Hvis der angives et tal uden enheder, er det en multiplikator, som ganges med værdien af egenskaben border-width. Negative værdier understøttes ikke.

For mere detaljeret information om billeder til rammer, se egenskaben border-image.

Syntaks

selektor {
	border-image-outset: positivt tal;
}

Eksempel . Tal

Indstil værdien af border-image-outset til 3 ved at holde musen over elementet. Herved flyttes rammen 26px*3 - dvs. 3 gange længere væk, end dens bredde, angivet i 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;
}

Eksempel . Pixels

Indstil værdien af border-image-outset til 30px ved at holde musen over elementet. Herved flyttes rammen 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;
}

Se også

egenskaben border-image,
som er en sammentrækning for ramme-billede
egenskaben border-image-source,
som angiver stien til billedet for rammen
egenskaben border-image-slice,
som opdeling af billedet for rammen
egenskaben border-image-repeat,
som gentagelse af billedet for rammen
egenskaben border-image-width,
som angiver størrelsen på billedet for rammen