border-style
/*
* border-style:
solid: A solid, continuous line.
none (default): No line is drawn.
hidden: A line is drawn, but not visible. this can be handy for adding a little extra width to an element without displaying a border.
dashed: A line that consists of dashes.
dotted: A line that consists of dots.
double: Two lines are drawn around the element.
groove: Adds a bevel based on the color value in a way that makes the element appear pressed into the document.
ridge: Similar to groove, but reverses the color values in a way that makes the element appear raised.
inset: Adds a split tone to the line that makes the element appear slightly depressed.
outset: Similar to inset, but reverses the colors in a way that makes the element appear slightly raised.
*/
/* Example using the typical solid border-style */
div {
border: 1px solid #4e1f9d;
}
div {border-style: solid;}
div {border-style: dashed;}
div {border-style: double;}
div {
border-style: groove;
border-color: coral;
border-width: 7px;
}
div {
border-style: ridge;
border-color: coral;
border-width: 7px;
}
div {
border-style: inset;
border-color: coral;
border-width: 7px;
}
div {
border-style: outset;
border-color: coral;
border-width: 7px;
}
p.one {border-style: dotted solid dashed double;}
p.two {border-style: dotted solid dashed;}
p.three {border-style: dotted solid;}
p.four {border-style: dotted;}