Création d'une ligne / section / bordure diagonale avec CSS

Je suis en train de créer une ligne diagonale sur une page web, d'une section/saut de section. Il s'agit essentiellement d'une scission de la couleur de l'article. Je ne peux pas utiliser une image comme si la page est agrandie, l'image va pixeliser. Donc j'ai besoin d'être en mesure de tracer une ligne diagonale directement au bas de la div, comme l'image ci-dessous.

J'ai essayé à l'aide d'une frontière, mais je ne peux pas obtenir la coupure effective à être dans le milieu, plutôt que la droite ou la gauche.

Est-il un moyen de dessiner des lignes diagonales dans le CSS? Comme vous pouvez le voir, j'ai besoin de créer un div qui est 90px de haut et ont le split/diagonale dans cette div. Je peux alors jetez un oeil à l'ajout de l'image, mais la question principale est de ne pas savoir si c'est possible avec les CSS.

Création d'une ligne /section /bordure diagonale avec CSS

source d'informationauteur Dom Greenslade BSc

  1. -1

    Vous pouvez le faire à l'aide d'un gradient.

    body {
  height: 200px;
  margin: 0 0 20px 0;
  background-color: transparent;
  background-size: 20px 20px;
  background-image:
     -webkit-repeating-linear-gradient(-45deg, black, black 1px, transparent 1px, transparent 14px);
  background-image:
     -moz-repeating-linear-gradient(-45deg, black, black 1px, transparent 1px, transparent 14px);
  background-image:
     -o-repeating-linear-gradient(-45deg, black, black 1px, transparent 1px, transparent 14px);
  background-image:
     repeating-linear-gradient(-45deg, black, black 1px, transparent 1px, transparent 14px);
}

    JSFiddle