How to change the border into a circle in html

Most people do not understand the knowledge points of this article "how to turn the frame into a circle in html", so the editor summarizes the following contents, detailed contents, clear steps, and has a certain reference value. I hope you can get something after reading this article. Let's take a look at this "how to turn the frame into a round" article in html.

Method: 1, use width and height attributes to set the element to square; 2, use "border: border size solid color value;" to add borders to square elements; 3, use "border-radius: 50%;" statement to make the border round.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

To turn the border into a circle in html

1. Create a div element and set it to square using the width and height attributes

Div {width: 100px; height: 100px; background-color: # FFC0CB;}

2. Add a border

Div {width: 100px; height: 100px; background-color: # FFC0CB; border: 2px solid black;}

3. Turn the border into a circle

Div {width: 100px; height: 100px; background-color: # FFC0CB; border: 2px solid black; border-radius: 50%;}

The above is about the content of this article on "how to turn the frame into a circle in html". I believe we all have some understanding. I hope the content shared by the editor will be helpful to you. If you want to know more about the relevant knowledge, please pay attention to the industry information channel.