border

Description

border is a shorthand property that defines the width, color, and style of a border.

ItemValue
Initial value Initial value from individual properties.
Inherited No.
Version CSS1
JavaScript syntax object.style.border="3px solid blue"
Applies to All elements.

Syntax and Property Values


border: border-width border-style border-color

The property values are listed in the following table.

Value Description
border-width Set the width of the border
border-style Set the style of the border
border-color Set the color of the border
inherit Inherit the border property from the parent element

Example


<!DOCTYPE HTML>
<html>
    <head>
        <style>
            h1 {<!--   ww  w . j  a v  a 2  s .  c  om-->
                border: thin solid rgb(0, 0, 0);
            }
            p {
                border: thin solid rgb(0, 0, 0);
            }
        </style>
    </head>
    <body>
        <h1>
            This is a heading
        </h1>
        <p>
            This is a paragraph of text.
        </p>
    </body>
</html>

Click to view the demo

The code above generates the following result.

border

Adding a black thick solid border


<!DOCTYPE HTML>
<html>
  <head>
    <style type='text/css'>
      div {<!--  w w w  .  j a va2s.c o m-->
        border: thick solid black;
      }
    </style>
  </head>
  <body>
    <div>border-width: thick;</div>
  </body>
</html>

Click to view the demo

The code above generates the following result.

border




















Home »
  HTML CSS »
    HTML CSS Reference »




HTML Tag Reference
CSS Reference
CSS Selector Reference
Encoding Reference