Border Properties

Notes: The table contains most common CSS properties/values. The browsers might ignore some of the properties!
Most off the properties have 'initial', 'unset' and 'inherit' values:

• initial: resets all of the selected element's properties to their initial values as defined in the CSS spec.
• inherit: the selected element inherits all of its parent element's styling, including styles that are not normally inheritable.
• unset: the selected element inherits any inheritable values passed down from the parent element. If no inheritable value is available, the initial value from the CSS spec is used for each property.

Property	Value	Description	Comments
border-color border-top-color border-right-color border-bottom-color border-left-color	[color] {1,4}	Sets the colour of the border	The four border parts (top, right, bottom, left) can be set to different colours in one declaration: p { border-color: black red black red; } You can use also border-top-color, border-right-color, border-bottom-color, border-left-color to set individual edges.
border-style border-top-style border-right-style border-bottom-style border-left-style	none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset {1,4}	Sets the birder style	The four border parts (top, right, bottom, left) can be set to different styles in this declaration. You can use also border-top-style, border-right-style, border-bottom-style, border-left-style to set individual edges.
border-width border-top-width border-right-width border-bottom-width border-left-width	[length] | [percentage] | thin | medium | thick {1, 4}	Sets the border width	The four border parts (top, right, bottom, left) can be set to different width in this declaration. You can use also border-top-width, border-right-width, border-bottom-width, border-left-width to set individual edges.
border-radius border-top-left-radius border-top-right-radius border-bottom-right-radius border-bottom-left-radius	[length]|[percentage]	Define how rounded border corners are	Value 0 means normal (not rounded) corner. Use MDN Border Radius Generator to generate rounded corners
border-image		Allows drawing an image on the borders of elements. Example:	See MDN Border Image Generator
border	border-width || border-style || border-color	A shorthand for setting the same width, style, and colour to all four border parts