Home > Developer > Web Develop
Question: How do I use div+css and positioning to achieve rounded rectangles?
Workaround Overview:
Content: First in the <body> tag inside add a large layer (large layer to fix the overall large frame), and then the large layer contains four small layers (four small layers of four fillets respectively (pre-oval shape with PS, and then cut with a slicing tool))
Style: CSS properties to be set inside the
1.position:relative;
2. Width and height;
3 background color;
4. Border line (used to adjust the relative position of four original angle, adjust the border line settings can be deleted)
When setting up a small layer of CSS, the attributes that are required in each layer are:
1.position:absolute;
2. Width and height;
3. Directional properties (left,right,bottom,top)
4.background:url ("") no-repeat; (rounded pictures in all directions)
Here is the code for my rounded rectangle:
<!doctype html>Note: The CSS style used in my code is inline, with three types of CSS styles: inline, inline, external.
HTML implementation Rounded Rectangle
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
