Cover Image for CSS Border
279 views

CSS Border

The CSS border property is used to set the border around an HTML element. The border property can be used with several values such as border-width, border-style, and border-color. Here are some common CSS border properties:

  1. border-style: sets the style of the border (solid, dashed, dotted, double, groove, ridge, inset, outset, none)
  2. border-width: sets the width of the border
  3. border-color: sets the color of the border
  4. border-radius: sets the rounding of the corners of the border

Here is an example of using the border shorthand property to set a border with a solid style, 1px width, and red color:

CSS
div {
   border: 1px solid red;
}

In this example, the border property is used to set a border with a 1 pixel width, a solid style, and a red color.

You can also use the individual border properties to set the border around an element. Here’s an example:

CSS
div {
   border-width: 2px;
   border-style: dotted;
   border-color: blue;
   border-radius: 10px;
}

In this example, the border-widthborder-style, and border-color properties are used to set a border with a 2 pixel width, a dotted style, and a blue color. The border-radius property is used to round the corners of the border.

By using CSS border properties, you can add visual interest and definition to your HTML elements, making them stand out and enhancing the overall design of your web page.

YOU MAY ALSO LIKE...

The Tech Thunder

The Tech Thunder

The Tech Thunder


COMMENTS