What is border radius css?

 CSS Rounded Corners: border-radius CSS using for the creating any box or any container where we can add corner rounded with css. As we can use on the creating button with border-radius: 10px;. If we will use border in the percent then it create a circle or the oval size.

border-radius: top-left top-right bottom-right bottom-left;

border-radius10px 20px 30px 40px;

Example border-radius code below:


<!DOCTYPE html>
#demo1 {
  border3px solid #0bf;
  padding10px 20px;
#demo2 {
  border3px solid #0bf;
#demo3 {
  border3px solid #0bf;
  padding10px 20px;
#demo4 {
  border3px solid #0bf;
  padding10px 20px;
  border-radius10px 20px 30px 40px;
#mainmax-width400pxmargin20px auto;}
<div id="main">
<h2>Normal border Radius</h2>
<div id="demo1"> You can use any content</div>
<h2>border-radius with circle</h2>
<div id="demo2">Test</div>
<h2>border-radius with oval</h2>
<div id="demo3"> <p>You can use any content</p></div>
<h2>border-radius with all corner different</h2>
<div id="demo4"> <p>You can use any content</p></div>


No comments:

Note: Only a member of this blog may post a comment.

Copyright Reserved to Anything Learn. Powered by Blogger.