The border property in CSS is used to specify the border around an element. It is a shorthand property that combines the following individual properties:

  • border-width: Specifies the width of the border.
  • border-style: Specifies the style of the border. Possible values include solid, dotted, dashed, double, groove, ridge, inset, and outset.
  • border-color: Specifies the color of the border.
Here is an example of how to use the border property to specify a solid red border with a width of 2 pixels:

div {
border: 2px solid red;
}

You can also specify different values for each side of the border using the following properties:

  • border-top: Specifies the border for the top side of the element.
  • border-right: Specifies the border for the right side of the element.
  • border-bottom: Specifies the border for the bottom side of the element.
  • border-left: Specifies the border for the left side of the element.

Here is an example of how to use these properties to specify different borders for each side of the element:

div {
border-top: 1px solid red;
border-right: 2px dashed blue;
border-bottom: 3px dotted green;
border-left: 4px double purple;
}

You can also use the border-radius property to add rounded corners to the border. This property accepts a value in pixels or as a percentage of the element's size.

div {
border: 2px solid red;
border-radius: 5px;
}