specify border-color for each border

Simple code to create div element.
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
<style>
.box1{
 width:200px;
 height:100px;
 font-size: 12px;
 color: black;
 background:#D7E5F0;
 border:1px solid red;
}
</style>
<body>
<div id="div1" class="box1">
the div element is very often used together with CSS, to layout a web page.
</div>

border color can be assigned by several methods:

1) first method to set border color.
border :width style color;   // the color value assigned for all four borders.
example:
border : 3px solid #C0C0C0;
    
border : 3px dotted #008000;






2) second method to set border color, one of these lines.
border-color : [all_borders];
example:
border-color : #000080;

or:
border-color : [top_and_bottom] [right_and_left];
example:
border-color : blue red;

or:
border-color : [top] [right_and_left] [bottom];
example:
border-color : blue red green;

or:
border-color : [top] [right] [bottom] [left];
example:
border-color : blue red green orange;




3) third method to set border color.
border-top-color : [color];
border-right-color : [color];
border-bottom-color : [color];
border-left-color : [color];
example:
border-top-color : blue;
border-right-color : red;
border-bottom-color : green;
border-left-color : orange;







If this post was good and helpful for you, Please give it Like.
.
    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment