Border—Individual Sides
In CSS it is possible to specify different borders for different sides:
p {
border-top-style:dotted;
border-right-style:solid;
border-bottom-style:dotted;
border-left-style:solid;
}
The example above can also be set with a single property:
border-style:dotted solid;
The border-style property can have from one to four values.
border-style:dotted solid double dashed;
- top border is dotted
- right border is solid
- bottom border is double
- left border is dashed
border-style:dotted solid double;
- top border is dotted
- right and left borders are solid
- bottom border is double
border-style:dotted solid;
- top and bottom borders are dotted
- right and left borders are solid
border-style:dotted;
- all four borders are dotted
The border-style property is used in the example above.
However, it also works with border-width and border-color.
Demonstration
The following demonstration shows how the script of HTML and CSS is displayed on the Web:
