CSS2 Test Suite: 18.4 outline-style

[index page] [section] [Previous] [Next] [Specification]

The style declarations contained within this page:

INPUT {border: 3px solid gray;}
.cl1 {outline-style: solid;}
.cl2 {outline-style: double;}
.cl3 {outline-style: dotted;}
.cl4 {outline-style: dashed;}
.cl5 {outline-style: inset;}
.cl6 {outline-style: outset;}
.cl7 {outline-style: groove;}
.cl8 {outline-style: ridge;}
div.parent {outline-style: solid;}
div.inh1 {outline-style: inset;}
div.inh2 {outline-style: outset;}

Here's an input whose outline (when in focus) should be solid and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be double and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be dotted and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be dashed and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be inset and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be outset and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be grooved and of medium width. The outline should be drawn to the outside of the element border.

Here's an input whose outline (when in focus) should be ridged and of medium width. The outline should be drawn to the outside of the element border.

[div.parent] This DIV has been set with parental styles. The inline elements within this DIV are enclosed in square brackets in order to more easily discern their placement.
[div.inh1] This DIV should have a solid outline when it is in focus, as it has a style attribute set to inherit the outline-style value. [/div.inh1]
[div.inh2] This DIV should have a solid outline when it is in focus, as it has a style attribute set to inherit the outline-style value. [/div.inh2]
This is the end of the parent DIV. [/div.parent]
[index page] [section] [Previous] [Next] [Specification]