CSS Outline Property And Example

CSS Outline ?

There’s a variety of outline styles to make your content stand out css outline is a styling property that helps you emphasize some information or a design element in your website content.

The border of an HTML element can be manipulated with different border,outline and color, etc.

The outline are generally used to highlight element. An outline at a glance looks very similar to the border. Outline do not take up space, because they always placed on top of the box of the element which may cause them to overlap other element on the page.

Example:

Try This

Result:

    

    Warning: Internet Explorer 7 and earlier versions don't support
    the outline property. IE8 supports the outline properties only
 if a <!DOCTYPE> is specified.

Example 2:

Try This

Result :

  
I have a solid outline
  
I have an inset outline
  
I have an outset outline
  
I have a groove style outline
  
I have a ridge style outline
  
I have a double outline
  
I have a dashed outline
  
I have a dotted outline