Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
Change the color of right border with CSS
The border-right-color CSS property allows you to change the color of an element's right border specifically, without affecting the other borders.
Syntax
border-right-color: color;
Parameters
The color value can be specified using:
- Color names: red, blue, green
- Hex values: #FF0000, #00FF00
- RGB values: rgb(255, 0, 0)
- HSL values: hsl(0, 100%, 50%)
Example: Basic Right Border Color
<html>
<head>
<style>
.demo {
border: 3px solid black;
border-right-color: #FF0000;
padding: 10px;
margin: 10px;
}
</style>
</head>
<body>
<p class="demo">
This paragraph has a red right border
</p>
</body>
</html>
Example: Multiple Color Formats
<html>
<head>
<style>
.hex-color {
border: 4px solid gray;
border-right-color: #00FF00;
padding: 10px;
margin: 5px;
}
.rgb-color {
border: 4px solid gray;
border-right-color: rgb(0, 0, 255);
padding: 10px;
margin: 5px;
}
.named-color {
border: 4px solid gray;
border-right-color: purple;
padding: 10px;
margin: 5px;
}
</style>
</head>
<body>
<div class="hex-color">Hex color: Green right border</div>
<div class="rgb-color">RGB color: Blue right border</div>
<div class="named-color">Named color: Purple right border</div>
</body>
</html>
Key Points
- The element must have a border defined first using the
borderproperty - You can combine
border-right-colorwith other border properties likeborder-right-widthandborder-right-style - This property only affects the right border, leaving other borders unchanged
- If no right border exists, this property has no visible effect
Conclusion
The border-right-color property provides precise control over right border styling. It's useful for creating visual emphasis or custom design elements that require specific border coloring.
Updated on: 2026-03-15T23:18:59+05:30
233 Views
Advertisements