CSS

CSS Border

p {
  border: 2px solid red;
  border-radius: 5px;
}

css border properties

/* Border-Color: Used to set the color of an element's border. */
border-color: black;

/* Border-Style: Allows you to set the style of a border - none, dotted, dashed, solid, or double. */
border-style: dotted;

/* Border-Radius: Allows you to add rounded corners to */
border-radius: 15px;

/* Border-Width: Used to set the width of an element's border. */
border-width: 20%

/* Border: Shorthand Property */
border: 10px, red, double;

border css

p {
  border-style: solid;
  border-color: red;
  border-width: 5px;
}
/* You can also write above code in one line   */
p {
  border: 5px solid red;
}

border css

.borderstyles{
	border-style: none;
    border-style: hidden;
    border-style: dotted;
    border-style: dashed;
    border-style: solid;
    border-style: double;
    border-style: groove;
    border-style: inset;
    border-style: ridge;
    border-style: outset;
    border-style: initial;
    border-style: inherit;
}

border css

.your-class-name{
	border: 1px solid red;
} 
// border: 'width', 'style', 'color'

width:
size: px, pt, cm, em, etc.

style:
dotted, dashed, solid, double, groove, ridge, inset, outset, none, hidden

color:
red, #000, rgb(255,0,255), etc.

border css

      	                		  			Margin
			_____________________________________________________________________
			|   		 					Border								|	
			|			 ____________________________________________			|
  	  		|			 |					Padding 				|			|
	        |   		 |				_________________			|			|
	Margin	|	Border	 |	Padding		|	Content		|	Padding	| Border	|	Margin	
    	    |    		 |				_________________			|			|
   		    |   		 |					Padding					|			|
     		|    		 |__________________________________________|			|
        	|    		 					Border								|
        	|___________________________________________________________________|	
             								Margin							
																							

css border

#example {
    border-bottom: 2px solid #ccc;
}