W3Schools.com

CSS Outlines


An outline is a line that is drawn around elements (outside the borders) to make the element "stand out".

The outline properties specifies the style, color, and width of an outline.


Examples

Draw a line around an element (outline)
This example demonstrates how to draw a line around an element, outside the border edge.

Set the style of an outline
This example demonstrates how to set the style of an outline.

Set the color of an outline
This example demonstrates how to set the color of an outline.

Set the width of an outline
This example demonstrates how to set the width of an outline.


CSS Outline

An outline is a line that is drawn around elements (outside the borders) to make the element "stand out".

However, the outline property is different from the border property.

The outline is not a part of an element's dimensions; the element's total width and height is not affected by the width of the outline.

Outline

All CSS Outline Properties

The number in the "CSS" column indicates in which CSS version the property is defined (CSS1 or CSS2).

Property Description Values CSS
outline Sets all the outline properties in one declaration outline-color
outline-style
outline-width
inherit
2
outline-color Sets the color of an outline color_name
hex_number
rgb_number
invert
inherit
2
outline-style Sets the style of an outline none
dotted
dashed
solid
double
groove
ridge
inset
outset
inherit
2
outline-width Sets the width of an outline thin
medium
thick
length
inherit
2


WEB HOSTING
Best Web Hosting
PHP MySQL Hosting
Best Hosting Coupons
UK Reseller Hosting
Cloud Hosting
Top Web Hosting
$7.95/mo SEO Hosting
Premium Website Design
WEB BUILDING
XML Editor - Free Trial!
FREE Website BUILDER
Free Website Templates Free CSS Templates
Make Your Own Website
W3SCHOOLS EXAMS
Get Certified in:
HTML, CSS, JavaScript, XML, PHP, and ASP
W3SCHOOLS BOOKS
New Books:
HTML, CSS
JavaScript, and Ajax
STATISTICS
Browser Statistics
Browser OS
Browser Display
SHARE THIS PAGE