Exemple
Spécifiez comment répéter l'image de la frontière:
#borderimg
{
border-image-source: url(border.png);
border-image-repeat: repeat;
}
Essayez - le vous - même » Définition et utilisation
La propriété border-image-repeat spécifie si l'image de la frontière doit être répétée, arrondie ou étirée.
Astuce: Regardez aussi la frontière image propriété (a shorthand property for setting all the border-image-* properties) .
| Valeur par défaut: | stretch |
|---|---|
| Hérité: | no |
| Animable: | no. Read about animatable |
| Version: | CSS3 |
| Syntaxe JavaScript: | object .style.borderImageRepeat="round" Try it |
support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui prend en charge entièrement la propriété.
| Propriété | |||||
|---|---|---|---|---|---|
| border-image-repeat | 15.0 | 11.0 | 15.0 | 6.0 | 15.0 |
Syntaxe CSS
border-image-repeat: stretch|repeat|round|initial|inherit;Note: Cette propriété spécifie comment les images pour les côtés et la partie centrale de l'image de la frontière sont redimensionnées et carrelées. Donc, vous pouvez spécifier deux valeurs ici. Si la deuxième valeur est omis, il est supposé être le même que le premier.
propriété valeurs
| Valeur | La description | Joue-le |
|---|---|---|
| stretch | Valeur par défaut. L'image est étirée pour remplir la zone | Joue-le " |
| repeat | L'image est carrelé (repeated) pour remplir la zone | Joue-le " |
| round | L'image est en mosaïque (repeated) pour remplir la zone. Si elle ne remplit pas la zone avec un nombre entier de tuiles, l'image est redimensionnée pour qu'elle tienne | Joue-le " |
| space | L'image est en mosaïque (repeated) pour remplir la zone. Si elle ne remplit pas la zone avec un nombre entier de tuiles, l'espace supplémentaire est distribué autour des tuiles | |
| initial | Définit cette propriété à sa valeur par défaut. Lisez à propos initial | Joue-le " |
| inherit | Hérite cette propriété de son élément parent. Lisez à propos de hériteront |
Pages associées
CSS3 tutoriel: CSS3 frontaliers Images
Référence CSS: border-image property
Référence CSS: border-image-outset property
Référence CSS: la border-image-slice property
Référence CSS: la border-image-source property de
Référence CSS: border-image-width property
Référence HTML DOM: borderImageRepeat property