Comment créer un fond CSS bicolore avec une ligne diagonale ?

Une ligne diagonale divise un arrière-plan CSS bicolore

Réaliser un arrière-plan avec plusieurs couleurs séparées par une ligne diagonale nécessite une approche créative. Voici une méthode qui utilise des DIV séparés :

Le code fourni utilise un dégradé d'arrière-plan avec une transition dure pour créer la division :

<code class="css">.diagonal-split-background {
  background-color: #013A6B;
  background-image: -webkit-linear-gradient(30deg, #013A6B 50%, #004E95 50%);
}</code>

Cette solution offre une transition nette et transparente entre les deux couleurs de fond. En ajustant les valeurs d'angle et de couleur, vous pouvez personnaliser l'apparence de la ligne diagonale et les couleurs contrasté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!