말도 안되는 말이 많지 않습니다. 먼저 렌더링을 보여 드리겠습니다.
케이크는 바닥 케이크, 상단 케이크 및 촛불 부분의 세 부분으로 나뉩니다. HTML의 레이아웃은이 세 부분에 따라 레이아웃입니다. 다른 하나는 CSS 포지셔닝 및 CSS3 회전의 사용입니다. 더 간단합니다. 저는 농민들이 이해한다고 생각합니다.
나는 다른 사람들을 반복하지 않을 것입니다.
전체 HTML 코드 및 CSS 코드는 다음과 같습니다.
<html> <html> <meta charset = width : 600px; -5px;} / ** **. 겨울 : 280px; Box-Shadow : 0px 20px #3e2001. Rotatex (60deg); Reperation-radial-gradient (Circle, #783d01, #914909 10px, white} : 1px 고체 #3E2001; * /. BOTTOM-ONE {400px; 바닥 : 1px 고체 #914909; BOTTOM-ONE : 1;}. rotatex (60deg); : 0px; Border-Bottom-width : 0px; Z-index; px; Birthday的文字 **. #ffffff; 295px; z-index. 상단 : 10px; -5px; : 회전 (45deg); #ffd507; -shadow : 0px 0px #ffff00,} </style> </head> <div class = <div class = container> < div class = candle> <div class = fire> </div> <div class = top> </div> <div class = body> </div> <div class = bottom> </div> </div> < div class = top-one> <div class = top> </div> <div class = size> </div> <div class = bottom> </div> <div class = text> 생일 축하합니다 </div> < /div> <div class = 맨 아래 -one> <div class = top> </div> <div class = size> </div> <div class = bottom> <div class = line line1> </div> </ div> <div class = flower> <i style = top : -20px; <i style = top : rotatey (30deg)> Quick </i> <I Style = top : rotatey (50deg); /div> </body> </html>
위의 순수한 HTML5+CSS3 생일 케이크 (코드는 이해하기 쉽습니다) 시간이 지남에 따라. VEVB WULIN 웹 사이트를 지원해 주셔서 대단히 감사합니다!