manuel de référence CSS

règles CSS (RULES)

大全 des attributs CSS

CSS3 border-image-Propriété slice CSS3 border-image-Propriété outset

CSS3 border-image-Méthode d'utilisation et exemples de l'attribut repeat

border-image-L'attribut repeat CSS spécifie comment agrandir ou tiler l'image de bordure centrale pour qu'elle puisse correspondre à la taille du bord.

Le tableau suivant décrit l'utilisation et l'historique des versions de cet attribut, ainsi que la syntaxe d'utilisation de cet attribut dans les scripts JavaScript.

Valeur par défaut :	stretch
S'applique à :	Tous les éléments, mais lorsque les éléments de tableau (comme tr, th, td) ont un border-L'attribut collapse vaut collapse, le border-image-L'attribut repeat est invalide. Il est également applicable::first-letter.
Héritage :	Non
Animable :	Non.Voir également Attributs d'animation.
Version :	CSS3nouvelle fonctionnalité
Syntaxe JavaScript :	object.style.borderImageRepeat="round"

border-image-Syntaxe d'utilisation de repeat

La syntaxe de cet attribut est la suivante :

border-image-repeat: [ stretch | repeat | round | space ]　1　ou　2　values | initial | inherit

L'exemple suivant montre comment utiliser border-image-attribut repeat.

Exemple

.box {
　　　　width:　300px;
　　　　height:　150px;
　　　　border:　15px solide transparent;
　　　　border-image-source: url("border.png");
　　　　border-image-slice:　30;
　　　　border-image-repeat: round;
}

Testez pour voir‹/›

Valeur de l'attribut

Le tableau suivant décrit les valeurs de cette propriété.

Valeur	Description
stretch	L'image est étirée pour remplir l'espace entre les bords. C'est la valeur par défaut.
repeat	L'image est répétée ou redéployée jusqu'à ce qu'elle remplisse l'espace entre les bords.
round	L'image est répétée ou redéployée jusqu'à ce qu'elle remplisse l'espace entre les bords. Si l'espace ne peut pas être rempli par un nombre entier de carreaux, l'image est redimensionnée pour qu'elle puisse être redimensionnée.
space	L'image est répétée ou redéployée jusqu'à ce qu'elle remplisse l'espace entre les bords. Si l'espace ne peut pas être rempli par tous les carreaux, l'espace supplémentaire est réparti autour des carreaux.
initial	Réinitialisez cette propriété à sa valeur par défaut.
inherit	Si spécifié, l'élément lié utilise la propriété border de son élément parent-image-Valeur calculée de l'attribut repeat.

Compatibilité du navigateur

border-image-Compatibilité du navigateur de l'attribut repeat, les numéros dans le tableau suivant représentent la version minimale du navigateur prenant en charge cette propriété ; tous les navigateurs populaires prennent en charge cette propriété.

	Firefox 15+ Google Chrome15+ Internet Explorer 11+ Apple Safari 6+ Opera 15+

Pour en savoir plus

Veuillez consulter le tutoriel :CSS3Bordure,Bordure CSS.

Propriétés associées :border-image,border-image-source,border-image-slice,border-image-width,border-image-outset,border.

CSS3 border-image-Propriété slice CSS3 border-image-Propriété outset