specify border-style 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 style can be assigned by several methods:

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






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

or: 
border-style : [top_and_bottom] [right_and_left];
example:
border-style:solid dotted;

or: 
border-style : [top] [right_and_left] [bottom];
example:
border-style:solid double dotted;

or: 
border-style : [top] [right] [bottom] [left];
example:
border-style:solid double groove dotted;




3) third method to set border style.
border-top-style : [style];
border-right-style : [style];
border-bottom-style : [style];
border-left-style : [style];
example:
border-top-style:solid;
border-right-style:double;
border-bottom-style:groove;
border-left-style:dotted;







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

0 comments:

Post a Comment

Subscribe to: Post Comments ( Atom )