Learning CSS should have about three days of time, plus the basis for understanding, CSS has a bit of perceptual knowledge, the corresponding code has a better grasp, now by sharing a few photos of the form of sharing my harvest
Note: The department outside the border is called: Outline area
Figure A
Figure II
Might
Figure Four
Figure Five
Figure Six
Figure VII
Figure Eight
Figure Nine
Figure 10
Note: This beautiful thing is written in CSS code, good-looking, right?
1 <! DOCTYPE html>2 3 4 <meta charset= "UTF-8" >5 <title>Document</title>6 7 <style>8 Div{9 width:170px;Ten Height:140px; One Background-image: A Radial-gradient (circle at 50% 120%, Rgba (0,0,0,0.7) 23%, Rgba (0,0,0,0) 48%), - linear-gradient (30deg, Rgba (0,0,0,0.4) 10%, Rgba (0,0,0,0) 20%), - Radial-gradient (circle at 50% 33%, #f8f6f7 32%, Rgba (255,255,255,0) 32%), the radial-gradient (Circle at-13% 55%, #f8f6f7 20%, Rgba (255,255,255,0) 20%), - Radial-gradient (circle at 113% 55%, #f8f6f7 20%, Rgba (255,255,255,0) 20%), - linear-gradient (to bottom, #ef0015 20%, #b2000c 100%); - Border-radius:140px 140px 80px 80px; +} - </style> + <body> A at <div></div> - </body> -
Learn some CSS experiences and summarize the chapters