首页 > 网站 > WEB开发 > 正文

攻城狮送女友的CSS3生日蛋糕

2024-04-27 14:29:37
字体:
来源:转载
供稿:网友
攻城狮送女友的CSS3生日蛋糕

在线预览:http://keleyi.com/keleyi/phtml/html5/29.htm

代码如下:

Html代码收藏代码
  1. <!DOCTYPEhtml>
  2. <html>
  3. <head>
  4. <metacharset="UTF-8">
  5. <title>攻城狮送女友的CSS3生日蛋糕-柯乐义</title>
  6. <linkrel="stylesheet"href="http://keleyi.com/keleyi/phtml/html5/29/css/reset.css">
  7. <linkrel="stylesheet"href="http://keleyi.com/keleyi/phtml/html5/29/css/style.css"media="screen"type="text/css"/>
  8. </head>
  9. <body>
  10. <divclass="velas">
  11. <divclass="fuego">
  12. </div>
  13. <divclass="fuego">
  14. </div>
  15. <divclass="fuego">
  16. </div>
  17. <divclass="fuego">
  18. </div>
  19. <divclass="fuego">
  20. </div>
  21. </div>
  22. <svgid="cake"version="1.1"x="0px"y="0px"width="200px"height="500px"viewbox="00200500"
  23. enable-background="new00200500"xml:space="PReserve">
  24. <pathfill="#a88679"d="M173.667-13.94c-49.298,0-102.782,0-147.334,0c-3.999,0-4-16.002,0-16.002
  25. c44.697,0,96.586,0,147.334,0C177.667-29.942,177.668-13.94,173.667-13.94z">
  26. <animateid="bizcocho_3"attributename="d"calcmode="spline"keysplines="0011;0011"
  27. begin="relleno_2.end"dur="0.3s"fill="freeze"values="
  28. M173.667-13.94c-49.298,0-102.782,0-147.334,0c-3.999,0-4-16.002,0-16.002
  29. c44.697,0,96.586,0,147.334,0C177.667-29.942,177.668-13.94,173.667-13.94z
  30. ;
  31. M173.667,411.567c-47.995,12.408-102.955,12.561-147.334,0
  32. c-3.848-1.089-0.189-16.089,3.661-15.002c44.836,12.66,90.519,12.753,139.427,0.07
  33. C173.293,395.631,177.541,410.566,173.667,411.567z
  34. ;
  35. M173.667,427.569c-49.795,0-101.101,0-147.334,0c-3.999,0-4-16.002,0-16.002
  36. c46.385,0,97.539,0,147.334,0C177.668,411.567,177.667,427.569,173.667,427.569z
  37. "/>
  38. </path>
  39. <pathfill="#8b6a60"d="M100-178.521c1.858,0,3.364,1.506,3.364,3.363c0,0,0,33.17,0,44.227
  40. c0,19.144,0,57.431,0,76.574c0,10.152,0,40.607,0,40.607c0,1.858-1.506,3.364-3.364,3.364l0,0c-1.858,0-3.364-1.506-3.364-3.364c0,0,0-30.455,0-40.607c0-19.144,0-57.432,0-76.575c0-11.057,0-44.226,0-44.226C96.636-177.015,98.142-178.521,100-178.521
  41. L100-178.521z">
  42. <animateid="relleno_2"attributename="d"calcmode="spline"keysplines="0011;0011;000.581"
  43. begin="bizcocho_2.end"dur="0.5s"fill="freeze"values="
  44. M100-178.521c1.858,0,3.364,1.506,3.364,3.363c0,0,0,33.17,0,44.227
  45. c0,19.144,0,57.431,0,76.574c0,10.152,0,40.607,0,40.607c0,1.858-1.506,3.364-3.364,3.364l0,0c-1.858,0-3.364-1.506-3.364-3.364c0,0,0-30.455,0-40.607c0-19.144,0-57.432,0-76.575c0-11.057,0-44.226,0-44.226C96.636-177.015,98.142-178.521,100-178.521
  46. L100-178.521z
  47. ;
  48. M100,267.257c1.858,0,3.364,1.506,3.364,3.363c0,0,0,33.17,0,44.227
  49. c0,19.143,0,57.43,0,76.574c0,10.151,0,40.606,0,40.606c0,1.858-1.506,3.364-3.364,3.364l0,0c-1.858,0-3.364-1.506-3.364-3.364
  50. c0,0,0-30.455,0-40.606c0-19.145,0-57.432,0-76.576c0-11.057,0-44.225,0-44.225C96.636,268.763,98.142,267.257,100,267.257
  51. L100,267.257z
  52. ;
  53. M93.928,405.433c-0.655,6.444-0.102,9.067,2.957,11.798c0,0,8.083,5.571,16.828,3.503
  54. c18.629-4.406,43.813,6.194,50.792,7.791c14.75,3.375,9.162,6.867,9.162,6.867c-2.412,2.258-58.328,0-73.667,0l0,0
  55. c-1.858,0-69.995,2.133-73.667,0c0,0-3.337-2.439,6.172-5.992c11.375-4.25,52.875,8.822,47.139-9.442
  56. c-6.333-20.167,5.226-21.514,5.226-21.514c3.435-0.915,12.78-6.663,10.923-0.546L93.928,405.433z
  57. ;
  58. M102.242,427.569c5.348,0,14.079,0,17.462,0c0,0,17.026,0,27.504,0
  59. c19.143,0,20.39-3.797,26.459,0c3,1.877,0,7.823,0,7.823c-2.412,2.258-58.328,0-73.667,0l0,0c-1.858,0-67.187,0-73.667,0
  60. c0,0-4.125-4.983,0-7.823c5.201-3.58,16.085,0,23.725,0c8.841,0,20.762,0,20.762,0c3.686,0,8.597,0,19.511,0H102.242z
  61. "/>
  62. </path>
  63. <pathfill="#a88679"d="M173.667-15.929c-46.512,0-105.486,0-147.334,0c-3.999,0-4-16.002,0-16.002
  64. c43.566,0,97.96,0,147.334,0C177.667-31.931,177.666-15.929,173.667-15.929z">
  65. <animateid="bizcocho_2"attributename="d"calcmode="spline"keysplines="0011;0011;0.2500.581"
  66. begin="relleno_1.end"dur="0.5s"fill="freeze"values="
  67. M173.667-15.929c-46.512,0-105.486,0-147.334,0c-3.999,0-4-16.002,0-16.002
  68. c43.566,0,97.96,0,147.334,0C177.667-31.931,177.666-15.929,173.667-15.929z
  69. ;
  70. M173.434,445.393c-47.269,8.001-105.245,8.001-147.334,0c-3.929-0.747-0.692-16.543,3.243-15.824
  71. c43.828,8.001,92.165,8.001,140.739,0C174.029,428.918,177.377,444.726,173.434,445.393z
  72. ;
  73. M173.667,449.514c-47.576-5.454-102.799-5.744-147.333,0c-3.966,0.512-3.938-15.297,0-16.002
  74. c43.683-7.823,97.646-8.026,147.333,0C177.616,434.15,177.642,449.969,173.667,449.514z
  75. ;
  76. M173.667,451.394c-49.298,0-102.782,0-147.334,0c-3.999,0-4-16.002,0-16.002
  77. c44.697,0,96.586,0,147.334,0C177.667,435.392,177.668,451.394,173.667,451.394z
  78. "/>
  79. </path>
  80. <pathfill="#8b6a60"d="M101.368-73.685c0,12.164,0,15.18,0,28.519c0,22.702,0-13.661,0,8.304c0,14.48,0,18.233,0,30.512
  81. c0,1.753-2.958,1.847-2.958,0c0-12.68,0-16.277,0-30.401c0-21.983,0,11.66,0-8.305c0-13.027,0-15.992,0-28.628
  82. C98.411-75.883,101.368-75.592,101.368-73.685z">
  83. <animateid="relleno_1"attributename="d"calcmode="spline"keysplines="0011;0011;000.61"
  84. begin="bizcocho_1.end"dur="0.5s"fill="freeze"values="
  85. M101.368-73.685c0,12.164,0,15.18,0,28.519c0,22.702,0-13.661,0,8.304c0,14.48,0,18.233,0,30.512
  86. c0,1.753-2.958,1.847-2.958,0c0-12.68,0-16.277,0-30.401c0-21.983,0,11.66,0-8.305c0-13.027,0-15.992,0-28.628
  87. C98.411-75.883,101.368-75.592,101.368-73.685z
  88. ;
  89. M101.368,350.885c0,12.164,0,65.18,0,78.518c0,22.703,0-33.66,0-11.695c0,14.48,0,28.232,0,40.512
  90. c0,1.753-2.958,1.847-2.958,0c0-12.68,0-26.277,0-40.402c0-21.982,0,31.66,0,11.695c0-13.027,0-65.992,0-78.627
  91. C98.411,348.686,101.368,348.977,101.368,350.885z
  92. ;
  93. M128.38,447.567c37.626,6.312,39.303,13.658,26.833,12.833c-22.653-1.499-13.636-0.831-23.302-0.831
  94. c-14.48,0-17.884,0-30.163,0c-2.087,0-2.068,0-3.915,0c-13.333,0-8.963,0-23.088,0c-11.668,0-14.062,5.995-27.532,1.164
  95. c-12.629-4.529,38.667-3.167,46.833-17.333C100.077,432.94,105.546,443.736,128.38,447.567z
  96. ;
  97. M173.667,451.394c2.875,0,2.997,9.257,0,9.131c-22.662-0.956-32.09-0.956-41.756-0.956
  98. c-14.48,0-17.884,0-30.163,0c-2.087,0-2.068,0-3.915,0c-13.333,0-8.963,0-23.088,0c-11.668,0-34.99-0.294-48.412,1.831
  99. c-4.109,0.65-3.01-10.006,0-10.006C37.129,451.394,149.379,451.394,173.667,451.394z
  100. "/>
  101. </path>
  102. <pathfill="#a88679"d="M173.667,21.571c-33.174,0-111.467,0-147.334,0c-4,0-4-16.002,0-16.002c39.836,0,105.982,0,147.334,0
  103. C177.668,5.569,177.667,21.571,173.667,21.571z">
  104. <animateid="bizcocho_1"attributename="d"calcmode="spline"keysplines="0011;0011;0011;0.25011;0011;0.2500.61"
  105. begin="2s"dur="0.8s"fill="freeze"values="
  106. M173.667,21.571c-33.174,0-111.467,0-147.334,0c-4,0-4-16.002,0-16.002c39.836,0,105.982,0,147.334,0
  107. C177.668,5.569,177.667,21.571,173.667,21.571z
  108. ;
  109. M173.667,459.569c-33.197,16.002-110.782,16.002-147.334,0c-3.664-1.604,1.614-15.617,5.337-14.153
  110. c40.702,16.002,94.289,16.104,136.505,0.103C171.917,444.1,177.271,457.832,173.667,459.569z
  111. ;
  112. M171.817,475.571c-39.361-3.001-105.438-2.571-143.556,0c-3.991,0.27-7.377-14.736-3.387-15.014
  113. c41.553-2.888,104.421-3.121,150.51-0.233C179.378,460.574,175.806,475.875,171.817,475.571z
  114. ;
  115. M171.817,459.564c-38.8-12.188-104.504-13.762-143.556,0c-3.772,1.329-7.961-12.604-4.178-13.905
  116. c40.864-14.064,105.114-15.52,151.918-0.973C179.822,445.874,175.634,460.762,171.817,459.564z
  117. ;
  118. M173.667,475.571c-46.376-5.005-105.924-
上一篇:公认的媒体类型

下一篇:CSS-浮动篇float

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表