The rounded corners are applied to the element's background area, the element's border, and the box-shadow if specified. The CSS3 border-radius property allows you to apply rounded corners to HTML elements without the need to use images or other hacks.
Syntax:-
.className {
border-radius: radius;
}
HTML file:-
<!DOCTYPE html><br>
<html><br>
<head><br>
<title>Border-radius</title><br>
<link href="style.css" type="text/css" rel="stylesheet"/><br>
</head><br>
<body><br>
<div class="radius"><br>
The Border-radius Property<br>
</div><br>
</body><br>
</html><br><br>
CSS file:-
.radius {
width: 250px;
background: #acbefa;
border: 3px solid #000;
border-radius: 10px;
text-align: center;
padding: 40px 0px;
color: #396A93;
}
0 Comment(s)