Maison >interface Web >tutoriel CSS >Comment obtenir un découpage parfait pour les bordures dégradées à l'aide de border-image-slice ?
Les bordures dégradées ajoutent une touche unique aux éléments Web, mais comprendre comment l'image-bordure interagit avec eux peut être déroutant.
En CSS, border-image-slice définit le découpage d'une image de bordure en neuf régions. Pour les bordures dégradées, la taille de l'image est égale à la taille de l'élément. Si la largeur de l'image de bordure n'est pas spécifiée, la largeur de bordure est utilisée pour définir les régions.
Pour obtenir l'effet souhaité, border-image-width image-slice doit être égal à border-image-width (ou border-width si aucune unité n'est spécifiée) en pixels.
Les valeurs sans unité dans border-image-slice sont valeurs de pixels prises en compte.
Les valeurs en pourcentage dans border-image-slice sont résolues en fonction de la taille de l'élément.
Dans votre exemple, où border-image-slice est défini sur 80 :
[Image de Découpage des bordures dégradées]
Pour obtenir un découpage parfait des bordures dégradées :
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!