How to use the border-radius attribute in css
Editor to share with you how to use the border-radius attribute in css, I believe 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 know it!
First, we can use the border-radius property to fillet
Fillets for button and div can be created using the border-radius property
For example:
.button _ kadomaru {
Border-radius:20px
}
You can specify a fillet like this.
The value you specify is only the size of the radius of the ellipse in the case of px, and in the% case, it specifies the ratio of the radius of the ellipse to the width and height of the specified box.
Let's take a look at specific code examples.
Fillet button
HTML code
Fillet button
CSS code
.button _ kadomaru {
Background:rgb (92pm 92225)
Color:rgb (225225225)
Border-radius:10px
}
Fillet border when using px to specify a radius
HTML code
Fillet border
CSS code
.div _ kadomaru1 {
Background:rgb (255, 92, 992)
Width:200px
Height:100px
Padding:20px
Border-radius:20px
}
Fillet border when using% to specify radius
HTML code
Specify the fillet at%.
CSS code
.div _ kadomaru2 {
Background:rgb (92, 255, 92)
Width:200px
Height:100px
Padding:20px
Border-radius:40%
}
The above is all the content of the article "how to use the border-radius attribute 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!
