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

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






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

or: 
border-width : [top_and_bottom] [right_and_left];
example:
border-width:1px 5px;

or: 
border-width : [top] [right_and_left] [bottom];
example:
border-width:1px 5px 10px;

or: 
border-width : [top] [right] [bottom] [left];
example:
border-width:1px 5px 10px 15px;




3) third method to set border width.
border-top-width : [width];
border-right-width : [width];
border-bottom-width : [width];
border-left-width : [width];
example:
border-top-width:1px;
border-right-width:5px;
border-bottom-width:10px;
border-left-width:15px;







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 )