border-radius
The border-radius CSS property allows Web authors to define how rounded border corners are. The curve of each corner is defined using one or two radii, defining its shape: circle or ellipse.
The radius applies to the whole background, even if the element has no border; the exact position of the clipping is defined by the background-clip property.
This property is a shorthand to set the four properties border-top-left-radius, border-top-right-radius, border-bottom-right-radius and border-bottom-left-radius.
Example
<!DOCTYPE HTML>
<html>
<head>
<title>CSS Tutorials</title>
<style>
div {
border-radius:20px;
width:200px;
height:200px;
background-color:#D9FBC4;
}
</style>
</head>
<body>
<div>
border-left-style
</div>
</body>
</html>
