How to set all the four border radius properties at once with JavaScript?



To set all the border-radius properties in JavaScript, use the borderRadius property. Set the border-radius properties at once using this.

Example

You can try to run the following code to learn how to set all the four border-radius properties −

Live Demo

<!DOCTYPE html> <html>    <head>       <style>          #box {             border: thick solid gray;             width: 200px;             height: 200px          }       </style>    </head>    <body>       <div id="box">Demo Text</div>       <br><br>       <button type="button" onclick="display()">Add border radius</button>       <script>          function display() {             document.getElementById("box").style.borderRadius = "20px";          }       </script>    </body> </html>
Updated on: 2020-06-23T11:12:03+05:30

170 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements