Home HTML CSS JavaScript React Gamedatum.com
× Home HTML CSS JavaScript React Gamedatum.com

CSS Borders

In CSS you can style, color and change the size of an element's Borders using the "border" property.

The Border is specified as per below:

  • border-style: dotted | dashed | solid | double | groove | ridge | hidden | none | inset | outset;
  • border-width: numeric value
  • border-color: any color
  • border-radius: numeric value or %

This property can accept up to 4 values!

e.g p.mix {border-style: ridge dotted groove double;}

Some Border examples:

      div.p1 {
  border-style: solid;
  border-width: 10px;
           div.p2 {
  border-style: dotted;
  border-width: thick;


      <div class="p1 ">Solid 10px</div>

      <div class="p2 ">Dotted thick</div>


The output:

Solid 10px
Dotted thick