Shulou(Shulou.com)06/02 Report--

This article introduces the relevant knowledge of "introduction to the use of CSS3 frame". Many people will encounter such a dilemma in the operation of actual cases, so let the editor lead you to learn how to deal with these situations. I hope you can read it carefully and be able to achieve something!

Border-radius: 5px 4px 3px 2px; / the four radius values are upper left, upper right, lower right and lower left, clockwise /

Solid circle:

Method: set the width (width) and height (height) values to be the same (that is, square), and the four fillet values are set to half of their values. The code is as follows:

Div {height:100px;/* and width settings are the same * / width:100px; background:#9da; border-radius:50px;/* four fillet values are set to half of the width or height value * /}

Set the left semicircle

Border-radiusdiv.semi-circle {height:100px; width:50px; background:#9da; border-radius:50px 00 50px;} box-shadow

Box-shadow adds shadows to the box. Support to add one or more

Parameter description:

Note: inset can be written in the first or last parameter, other locations are invalid.

This is the end of the introduction to the usage of CSS3 frame. Thank you for your reading. If you want to know more about the industry, you can follow the website, the editor will output more high-quality practical articles for you!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.