CSS3 border-image
Exemples
Désigné comme une bordure autour de l'élément image div:
{
-webkit-border image: url (border.png) 30 30 tour; / * Safari 5 * /
-o-frontière image: url (border.png) 30 30 tour; / * Opera * /
frontière image: url (border.png) 30 30 tour;
}
Essayez »
Dans le bas de cette page pour plus d'exemples.
support du navigateur
Les chiffres du tableau représentent le premier navigateur pour soutenir le numéro de version de la propriété.
Immédiatement après la -webkit- numérique, -ms- ou -moz- il y a à l'appui du préfixe d'attribut premier numéro de version du navigateur.
propriété | |||||
---|---|---|---|---|---|
frontière image | 16,0 4.0 -webkit- | 11.0 | 15.0 3.5 -moz- | 6.0 3.1 -webkit- | 15.0 11,0 -o- |
Définition des attributs et des instructions
propriété border-image est un raccourci utilisé pour définir la frontière-image-Source , border-image Slice , border-image largeur , border-image OUTSET et border-image répétée valeur.
Omis paramètres à leurs valeurs par défaut.
Astuce: pour construire de belles touches évolutives en utilisant les propriétés de bordure-image- *!
Par défaut: | aucune 100% 1 0 étirement |
---|---|
Héritage: | aucun |
Version: | CSS3 |
Syntaxe JavaScript: | objet .style.borderImage = "url (border.png)30 30 rond" |
grammaire
值 | 描述 |
---|---|
border-image-source | 用于指定要用于绘制边框的图像的位置 |
border-image-slice | 图像边界向内偏移 |
border-image-width | 图像边界的宽度 |
border-image-outset | 用于指定在边框外部绘制 border-image-area 的量 |
border-image-repeat | 这个例子演示了如何创建一个border-image 属性的按钮。 |
D'autres exemples
Bouton d'image
Cet exemple montre comment créer un bouton d'attribut border-image.
articles connexes
CSS3 tutoriel: CSS3 Borders