CSS Borders

border-style

The border-style property is required to make a border visible. It can have values like dotted, dashed, solid, double, groove, ridge, inset, outset, or none.

p {
  border-style: dotted solid double dashed;
}

border-width

The border-width property specifies the width of the four borders. It can be set in pixels, pt, cm, em, etc., or by using one of the three pre-defined values: thin, medium, or thick.

p {
  border-style: solid;
  border-width: 5px;
}

border-color

The border-color property is used to set the color of the four borders. You can specify a single color for all sides, or different colors for each side.

p {
  border-style: solid;
  border-color: red green blue yellow; /* top right bottom left */
}

Border Shorthand

The border property is a shorthand for setting the individual border properties: border-width, border-style, and border-color.

p {
  border: 5px solid red;
}