CSS Imagini Border. Proprietatea border-image. Exemple în care secțiunile din mijloc sunt repetate sau întinse.

Proprietatea border-image. Exemple în care secțiunile din mijloc sunt repetate sau întinse

Aici, secțiunile din mijloc ale imaginii sunt repetate pentru a crea border:



Iată codul:

Exemplu:
 

#borderimg {
  border: 10px solid transparent;
  padding: 15px;
  border-image: url(border.png) 30 round;
}

Aici, secțiunile din mijloc ale imaginii sunt întinse pentru a crea border:



Iată codul:

Exemplu:

#borderimg {
  border: 10px solid transparent;
  padding: 15px;
  border-image: url(border.png) 30 stretch;
}

Sfat: Proprietatea border-image este de fapt o proprietate de tip shorthand pentru proprietățile border-image-source, border-image-slice, border-image-width, border-image-outset și border-image-repeat.