CSS - style-couleur-contour

La description

La propriété contour-color détermine le style d'un contour autour d'un élément.

Valeurs possibles

  • none - Aucun contour n'est dessiné.

  • dotted - Le contour est dessiné comme une série de points.

  • dashed - Le contour est dessiné sous la forme d'une série de segments de ligne courts.

  • solid - Le contour est dessiné comme une seule ligne ininterrompue.

  • double - Le contour est dessiné comme une paire de lignes ininterrompues.

  • groove - Le contour est dessiné comme s'il s'agissait d'un sillon creusé dans la surface du document.

  • ridge - Le contour est dessiné comme s'il s'agissait d'une arête remontant la surface du document.

  • inset - Le contour est dessiné comme si l'élément entier éloignait la surface du document de l'utilisateur.

  • outset - Le contour est dessiné comme si l'élément entier poussait la surface du document vers l'utilisateur.

S'applique à

Tous les éléments HTML.

Syntaxe DOM

object.style.outlineStyle = "solid";

Exemple

Voici l'exemple -

<html>
   <head>
   </head>
   
   <body>
      <p style = "outline-width:thin; outline-style:solid;">
         This text is having thin solid  outline.
      </p>
      <br />
      
      <p style = "outline-width:thick; outline-style:dashed;">
         This text is having thick dashed outline.
      </p>
      <br />
      
      <p style = "outline-width:5px;outline-style:dotted;">
         This text is having 5x dotted outline.
      </p>
   
   </body>
</html>

Cela produira le résultat suivant -