the color of the horizontal rule

color: ***; background-color: ***;

Browser
Internet Explorer Firefox Opera

The color property specifies the color of text in an element, and the background-color property specifies the background color of an element.

The color of the horizontal rule can be specified by applying these properties to the HR element.

hr {
background-color: red;
color: red;
border: none;
height: 3px;
}

Property Value Explanation
background-color color code or name the background color of the horizontal ruleInternet ExplorerFirefoxOpera
color color code or name the color of the horizontal ruleInternet Explorer

About the horizontal rule's border

Code Screen shot in MSIE Screen shot in Firefox Real example
hr {
background-color: #80ff80;
height: 10px;
} 		HR HR
hr {
background-color: #80ff80;
border: none;
height: 10px;
} 		HR HR
hr {
color: #80ff80;
height: 10px;
} 		HR HR
hr {
background-color: #80ff80;
color: #80ff80;
border: none;
height: 10px;
} 		HR HR

Example

<html>
<head>
<title>TAG index</title>

<style type="text/css">

hr.example1 {
background-color: #ff0000;
height: 10px;
}

hr.example2 {
background-color: #0000ff;
color: #0000ff;
border: none;
height: 1px;
}

</style>

</head>
<body>

<hr class="example1">

<hr class="example2">

</body>
</html>
Output