Detailed CSS style border properties

Border usage:

1. Border-width property sets the width of the border

Possible values: pixels

2. The Border-style property sets the style of the border

Possible values: solid (straight line), dashed (dashed), dotted (dotted line)

2. Border-color property sets the color of the border

Possible values: Red, #f00, #ff0000, RGB (255,0,0), transparent

Border-left property settings Left border

Border-right Property Set Right border

Border-top Property Set Top border

Border-bottom Property Set Bottom border

Extended extension

HTML code

<p></p>

CSS Code

p {    height:20px;    width:20px;    Border-color: #FF9600 #3366ff #12ad2a #f0ed7a;    Border-style:solid;    border-width:20px;}

Results

CSS Code

p {        width:0px;    height:0px;    Border-color: #FF9600 #3366ff #12ad2a #f0ed7a;    Border-style:solid;    border-width:20px;}

Results

CSS Code

p {        width:0px;    height:0px;    Border-color:lightblue transparent trnasparent transparent;    Border-style:solid;    border-width:20px;}

Results

CSS Code

p {        width:0px;    height:0px;    Border-color:transparent trnasparent Pink;    Border-style:solid;    border-width:20px;}

Results

CSS Code

p {        width:0px;    height:0px;    Border-color:transparent Gray trnasparent Transparent;    Border-style:solid;    border-width:20px;}

Results

CSS Code

p {        width:0px;    height:0px;    Border-color:transparent Transparent trnasparent lightgreen;    Border-style:solid;    border-width:20px;}

Results