#box {
padding: 20px;
border: 15px solid transparent;
border-image: url("images/border_image.png") 30 round;
}
In het volgende voorbeeld wordt de middelste deel van de afbeelding uitgerekt om de rand te creëren:
#box {
padding: 20px;
border: 15px solid transparent;
border-image: url("images/border_image.png") 30 stretch;
}
![]() |
De optie round is een variant van de optie repeat waarbij de afbeeldingstegels zo worden verdeeld dat de uiteinden mooi met elkaar verbonden zijn. |
border-image: url(border_img.png) 50 round;
border-image: url(border_img.png) 20% round;
border-image: url(border_img.png) 30% round;
#borderimg1 {
border: 10px solid transparent;
padding: 15px;
border-image: url(border.png) 50 round;
}
#borderimg2 {
border: 10px solid transparent;
padding: 15px;
border-image: url(border.png) 20% round;
}
#borderimg3 {
border: 10px solid transparent;
padding: 15px;
border-image: url(border.png) 30% round;
}
![]() |
Ad blocker gedetecteerd! |
Ons website heeft gedetecteerd dat u een Ad blocker gebruikt. Codecenter.nl is gratis, wij blijven overeind door het weergeven van advertenties en u kunt ons daarbij helpen. Het wordt aanbevolen om uw Ad blocker uit te schakelen zodat u verder gebruik kunt maken van codecenter.nl, alvast bedankt. |