border
attribute has properties for each border. so it is possible to specify a different border for each side.
1div {
2 border-top-style: solid;
3 border-right-style: dotted;
4 border-bottom-style: dashed;
5 border-left-style: double;
6}
Sample Output
border-top-style: solid; border-right-style: dotted; border-bottom-style: dashed; border-left-style: double;
TIP
- If the border-style property has four values:
- border-style: solid dotted dashed double;
- top border is solid
- right border is dotted
- bottom border is dashed
- left border is double
- If the border-style property has three values:
- border-style: solid dotted dashed;
- top border is solid
- right and left borders are dotted
- bottom border is dashed
- If the border-style property has two values:
- border-style: solid dotted;
- top and bottom borders are solid
- right and left borders are dotted
- If the border-style property has one value:
- border-style: solid;
- all four borders are solid