Content: First add a large layer inside the <body> tag (large layer is used to fix the overall large frame), and then include four small layers in the large layer (four rounded corners are placed in the four small layers (using PS in advance to make an oval shape, and then using the slice tool to cut the picture))
Style: The properties that css must have set inside the <head> tag:
1.position: relative;
2. Width and height;
3 background color;
4. Border line (used to adjust the relative position of the four original corners. After adjustment, you can delete the border line settings)
When setting up the css for small layers, the properties that must be found in each layer are:
1.position: absolute;
2. Width and height;
3. Direction attributes (left, right, bottom, top)
4.background: url() no-repeat; (introduce rounded corner pictures in various directions)
Here is my code to implement a rounded rectangle:
XML/HTML Code Copy content to clipboard