CSS Beginners Guide part 4 - Working with Borders

HI, today we are going know about CSS Borders, css providing to html elements to make the borders we can mange the border color, size, border style, before CSS3  we use round images to make the border to be rounded corners, but  now CSS3 implements it and we can use border-radius property to make the rounded corners.

we can define the borders using three major properties

1. border-style // it defines the border style it could be doted, dashed,
2. border-color // it defines the border color
3. border-width // it defines the border width

Applying Borders

we can use directly short-hand method to apply the all properties in one method using border property
ex:

<style>

div{border:color style width};

//

div{border:#ff00ff doted 3px};

</style>

Individual Border Sides

We can also apply the individual borders to individual sides to html elements like top, right, bottom, left, using border-top-style, border-right-style, border-bottom-style, border-left-style
ex:

<style>
div{
border-top-style:dotted;
border-bottom-style:solid;
border-right-style:dotted;
border-left-style:solid;

//above examples in short-hand method

border-style:top right bottom left;

border-style:solid dotted solid dotted;

}
</style>

Read more about CSS3 Borders