Creating a border around an HTML element in CSS involves using the border property. This property allows you to define the style, color, and width of the border surrounding the selected element. The border property can be used in a shorthand form or separately for individual properties.

Syntax

/* Shorthand syntax */
.box {
    border: 2px solid #333;
}

OR

/* Individual properties */
.box-individual {
    border-width: 1px;
    border-style: dashed;
    border-color: red;
}

Example:

Output:

Important Points:

• Shorthand and Individual Properties: The border property can be written in shorthand or as separate properties (border-width, border-style, border-color).
• Color Values: The border-color property accepts various color values.
• Style Options: The border-style property allows you to choose from different styles, such as solid, dashed, dotted, etc.
• Width: The border-width property sets the width of the border.