MDN may have intermittent access issues April 18 13:00 - April 19 01:00 UTC. See for all notifications.

Your Search Results

    outline-style Redirect 1


    The outline-style CSS property is used to set the style of the outline of an element. An outline is a line that is drawn around elements, outside the border edge, to make the element stand out.

    It is often more convenient to use the shortcut property outline instead of outline-style, outline-width and outline-color.


    Formal syntax: <br-style>
    outline-style: none
    outline-style: dotted
    outline-style: dashed
    outline-style: solid
    outline-style: double
    outline-style: groove
    outline-style: ridge
    outline-style: inset
    outline-style: outset
    outline-style: inherit


    <br-style> can be any of the following:

    No outline (outline-width is 0).
    The outline is a series of dots.
    The outline is a series of short line segments.
    The outline is a single line.
    The outline is two single lines. The outline-width is the sum of the two lines and the space between them.
    The outline looks as though it were carved into the canvas.
    The opposite of groove: the outline looks as though it were coming out of the canvas.
    The outline makes the box look as though it were embeded in the canvas.
    The opposite of inset: the outline makes the box look as though it were coming out of the canvas.


    .example {  /* make the outline a 3D groove style */
       outline-style: groove;        /* same result as "outline: groove" */ 


    Specification Status Comment
    CSS Basic User Interface Module Level 3 Working Draft No change.
    CSS Level 2 (Revision 1) Recommendation  

    Browser compatibility

    Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
    Basic support  1.0 1.5 (1.8) [*] 8.0 7.0 1.2 (125)
    Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
    Basic support ? ? ? ? ?

    [*] In browsers prior to Gecko 1.8 (Firefox 1.5) this effect can be achieved using Mozilla CSS Extension -moz-outline-style.

    See also

    Document Tags and Contributors

    Contributors to this page: Sheppy
    Last updated by: Sheppy,
    Hide Sidebar