How to realize fillet effect by css

Editor to share with you how to achieve css fillet effect, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to understand it!

Fillet effect

One of the most commonly used new css3 features is the fillet effect. Standard HTML square objects are 90 degrees square, and CSS3 can help you round corners.

-moz-border-radius: 20px;-webkit-border-radius: 20px; border-radius: 20px

Even a single corner can fillet, but the syntax of Mozilla and Webkit is slightly different.

-moz-border-radius-topleft: 20px;-moz-border-radius-topright: 20px;-moz-border-radius-bottomleft: 10px;-moz-border-radius-bottomright: 10px;-webkit-border-top-rightright-radius: 20px;-webkit-border-top-left-radius: 20px;-webkit-border-bottom-left-radius: 10px;-webkit-border-bottom-rightright-radius: 10px

Supported browsers: Firefox, Safari, Chrome

These are all the contents of the article "how to achieve fillet effect in css". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!