Comment puis-je créer un arrière-plan incliné en utilisant CSS ?

Créer un arrière-plan incliné avec CSS

Problème :

Vous souhaitez créer un arrière-plan incliné arrière-plan, comme illustré dans l’image fournie. Votre implémentation CSS actuelle n'obtient pas l'effet souhaité.

Solution :

Pour obtenir un arrière-plan incliné, vous pouvez utiliser un pseudo-élément avec une transformation inclinée :

body {
  height: 100vh;
  margin: 0;
  background: yellow;
}

body:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 300px;
  background: #000;
  transform: skew(-30deg);
  transform-origin: top;
}

Cette technique crée un élément incliné positionné dans le coin supérieur gauche de la fenêtre. En contrôlant la largeur de l'élément et l'angle d'inclinaison, vous pouvez personnaliser l'inclinaison en fonction de vos besoins.

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!