border-bottom-color

Browser Internet Explorer Netscape Opera Safari Firefox
Version 5.5 6.0 7.0 8.0 8.0 9.0 7.0 8.0 9.2 9.5 1.3 2.0 3.1 1.5 2.0 3.0
Supported Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes Yes

Short information
CSS CSS1
Default value Value of color fitted by parameter color
Inherited No
Applied To all elements
HTML analog <img border > | <table border>
Reference to specification http://www.w3.org/TR/CSS21/box.html#border-color-properties

Description
This parameter determines a border color at the bottom of an element.

Syntax

border-bottom-color: color

Arguments
You can specify a color by 3 means.
1. According to the name.
Browsers support some colors with the names.
2. Support with the hexadecimal denotation
For colors specifying it is used the numbers in hexadecimal code. This system unlike decimal is based on number 16. It uses next symbols: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Here you can see that numbers from 10 to 16 are changed by Latin letters. In the decimal denotation the numbers after 15 are formed by combination of 2 numbers into 1. For example, number 255 appropriates number FF in hexadecimal denotation. For avoiding misunderstandings to define accounting system, there is the symbol # before hexadecimal denotation, for example #666999. Each of three colors — red, green and dark blue — can take on values from 00 to FF. Thus, denotation of color is broken up on three constituents #rrggbb, where first 2 symbols mark red component of a color, 2 mediums do green and two last do – dark blue. It is assumed to use the brief form of kind #rgb, where every symbol is needed to double. So, it is necessary to consider record #fe0 as #ffee00.
3. With the help of RGB
It is possible to define a color using values of red, green and dark blue making in a decimal calculation. Value each of three colors can take on values from 0 to 255. It is also possible to set a color in a percentage ratio.

Example 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
  <title>border-bottom-color</title>
  <style type="text/css">
   DIV#panel {
    background: #ccc; /* Background color */
   } 
   #panel P {
    padding: 5px; /* Add fields */
    margin: 0; /* Remove indents of paragraph */
   }
   #panel P#title {
    background: navy; /* Background color */
    color: white; /* Text color */
    border-bottom-width: 2px; /* Bottom lineweight */
    border-bottom-style: solid; /* Bottom line style */
    border-bottom-color: white; /* Bottom line color */
   }
  </style>
 </head>
 <body>
 
  <div id="panel">
  <p id="title">Lorem ipsum dolor sit amet</p>
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, 
     sed diem nonummy nibh euismod tincidunt ut lacreet dolore 
     magna aliguam erat volutpat.</p>
  </div>
 </body>
</html>

The result of this example is shown on the figure 1


Object model

[window.]document.getElementById("elementID").style.borderBottomColor