CSS Outline

An outline is a line that is drawn around elements, OUTSIDE the borders, to make the element “stand out”. CSS has the following outline properties: outline-style. outline-color.

How do you style an outline in CSS?
  1. Set a style for the outline: div {outlinestyle: dotted;}
  2. A dashed outline: div {outlinestyle: dashed;}
  3. A solid outline: div {outlinestyle: solid;}
  4. A double outline: div {outlinestyle: double;}
  5. A groove outlineoutlinestyle: groove; …
  6. A ridge outlineoutlinestyle: ridge; …
  7. An inset outline: …
  8. An outset outline:

What is outline-offset in CSS?

The outlineoffset property adds space between an outline and the edge or border of an element. The space between an element and its outline is transparent. Outlines differ from borders in three ways: An outline is a line drawn around elements, outside the border edge.
CSS Outline Color
  1. CSS Outline Color. The outlinecolor property is used to set the color of the outline. The color can be set by: name – specify a color name, like “red” …
  2. HEX Values. The outline color can also be specified using a hexadecimal value (HEX):
  3. RGB Values. Or by using RGB values: Example. p.ex1

Terry White

Terry White is a professional Drupal & WordPress developer, Web developer, Web designer, Software Engineer, and Blogger. He strives for pixel-perfect design, clean robust code, and a user-friendly interface. If you have a project in mind and like his work, feel free to contact him

View all posts by Terry White →