CSS Outline

Introduction

Syntax

1/* outline syntax */
2input:focus {
3  outline: 2px solid blue;
4}

Example

1/* this draws an outline */
2p {
3  border: 1px solid black;
4  outline: 3px dashed red;
5  outline-offset: 5px;
6}

Key Points

• Outlines sit completely outside the border.
• Outlines do not affect the element's physical size.
• Outlines can overlap other elements.
• The `outline-offset` property adds space before the outline.