En esta ocasión vamos a ver como agregar una imagen como borde a un div, para ello CSS3 tiene una propiedad llamada border-image.
border-image:
border-image-source -> src de la imagen.
border-image-slice -> desplazamiento interno de la imagen.
border-image-width -> Especifica la anchura de border-image default auto.
border-image-outset -> La cantidad de imágenes borde que soporta, es limitado.
border-image-repeat -> stretch | round | repeat
Esta propiedad es compatible en IE9+, Firefox 4+, Chrome, Safari 5+ y Opera.
border-image -> Para todos los navegadores compatibles.
border-image -> Para todos los navegadores compatibles.
-moz-border-image -> Para versiones más antiguas de Firefox.
-webkit-border-image -> Para versiones de crhome y safari
-o-border-image -> Para versiones de Opera
Modo de uso ...
border-image: source slice width outset repeat;
Ejemplo: border-image: url(imagen.jpg) 40% 40% 120 120 round;
border image: | |
slide image: | Ejemplo: 40% 40% |
outset image: | Ejemplo: 122 122 |
repeat image: |
No hay comentarios:
Publicar un comentario