Learn CSS (Tutorial 7)
Presented by: Aakash Biswas
Duration: 12.24 minutes
Watch Tutorial 1: • Learn CSS (Tutorial 1)
Watch Tutorial 2: • Learn CSS (Tutorial 2)
Watch Tutorial 3: • Learn CSS (Tutorial 3)
Watch Tutorial 4: • Learn CSS (Tutorial 4)
Watch Tutorial 5: • Learn CSS (Tutorial 5)
Watch Tutorial 6: • Learn CSS (Tutorial 6)
CSS Outline
An outline is a line that is drawn around HTML elements.
It is drawn OUTSIDE the borders, to make the element highlighted.
CSS has the following outline properties:
1)outline-style
2)outline-color
3)outline-width
4)outline-offset
5)outline
The outline-style property specifies the style of the outline. It and can have any one of the following values:
1)dotted - Defines a dotted outline
2)dashed - Defines a dashed outline
3)solid - Defines a solid outline
4)double - Defines a double outline
5)groove - Defines a 3D grooved outline
6)ridge - Defines a 3D ridged outline
7)inset - Defines a 3D inset outline
8)outset - Defines a 3D outset outline
9)none - Defines no outline
10)hidden - Defines a hidden outline
The outline-color property is used to set the color of the outline.
The color can be set by:
1)name - specify a color name, like “yellow“
2)RGB - specify a RGB value, like "rgb(255,0,0)“
3)Hex - specify a hex value, like "#ff0000“
4)invert - performs a color inversion (which ensures that the outline is visible, regardless of color background)
The outline-width property specifies the width of the outline. It and can have one of the following values:
1)thin :1px
2)medium : 3px
3)thick : 5px
4)A specific size in px, pt, cm or em
The outline-offset property adds space between an outline and the edge or a border of an element.
The space between an element and its outline is transparent.
