五月天青色头像情侣网名,国产亚洲av片在线观看18女人,黑人巨茎大战俄罗斯美女,扒下她的小内裤打屁股

歡迎光臨散文網(wǎng) 會(huì)員登陸 & 注冊

簡單有趣的CSS動(dòng)畫效果，翻滾的發(fā)光方塊～

2023-06-23 18:38 作者:嘿大喵喵  | 我要投稿
  1. <!DOCTYPE?html>??
  2. <html?lang="en">??
  3. ??
  4. <head>??
  5. ????<meta?charset="UTF-8">??
  6. ????<meta?name="viewport"?content="width=device-width,?initial-scale=1.0">??
  7. ????<title>Document</title>??
  8. ????<style>??
  9. ????????*?{??
  10. ????????????margin:?0;??
  11. ????????????padding:?0;??
  12. ????????????box-sizing:?border-box;??
  13. ????????}??
  14. ??
  15. ????????body?{??
  16. ????????????min-height:?100vh;??
  17. ????????????display:?flex;??
  18. ????????????justify-content:?center;??
  19. ????????????align-items:?center;??
  20. ????????????background-color:?#000;??
  21. ????????????overflow:?hidden;??
  22. ????????}??
  23. ??
  24. ????????.container?{??
  25. ????????????width:?100%;??
  26. ????????????transform:?rotate(-35deg);??
  27. ????????}??
  28. ??
  29. ????????.box?{??
  30. ????????????display:?flex;??
  31. ????????????justify-content:?center;??
  32. ????????????align-items:?center;??
  33. ????????????width:?100%;??
  34. ????????????height:?200px;??
  35. ????????????-webkit-box-reflect:??
  36. ????????????????below?1px?linear-gradient(transparent,?#0004);??
  37. ????????????animation:?translate?1.5s?ease-in-out?infinite;??
  38. ????????}??
  39. ??
  40. ????????@keyframes?translate?{??
  41. ????????????0%?{??
  42. ????????????????transform:?translateX(0px);??
  43. ????????????}??
  44. ??
  45. ????????????100%?{??
  46. ????????????????transform:?translateX(-200px);??
  47. ????????????}??
  48. ????????}??
  49. ??
  50. ????????.cube?{??
  51. ????????????width:?200px;??
  52. ????????????height:?200px;??
  53. ????????????border-radius:?10px;??
  54. ????????????background-color:?#03e9f4;??
  55. ????????????box-shadow:?0?0?5px?rgba(3,?233,?244,?1),??
  56. ????????????????0?0?25px?rgba(3,?233,?244,?1),??
  57. ????????????????0?0?50px?rgba(3,?233,?244,?1),??
  58. ????????????????0?0?100px?rgba(3,?233,?244,?1),??
  59. ????????????????0?0?200px?rgba(3,?233,?244,?.5),??
  60. ????????????????0?0?300px?rgba(3,?233,?244,?.5);??
  61. ????????????transform-origin:?bottom?right;??
  62. ????????????animation:?rotate?1.5s?ease-in-out?infinite;??
  63. ????????}??
  64. ??
  65. ????????@keyframes?rotate?{??
  66. ????????????0%?{??
  67. ????????????????transform:?rotate(0deg);??
  68. ????????????}??
  69. ??
  70. ????????????60%?{??
  71. ????????????????transform:?rotate(90deg);??
  72. ????????????}??
  73. ??
  74. ????????????65%?{??
  75. ????????????????transform:?rotate(85deg);??
  76. ????????????}??
  77. ??
  78. ????????????70%?{??
  79. ????????????????transform:?rotate(90deg);??
  80. ????????????}??
  81. ??
  82. ????????????75%?{??
  83. ????????????????transform:?rotate(87.5deg);??
  84. ????????????}??
  85. ??
  86. ????????????100%?{??
  87. ????????????????transform:?rotate(90deg);??
  88. ????????????}??
  89. ??
  90. ????????}??
  91. ????</style>??
  92. </head>??
  93. ??
  94. <body>??
  95. ????<div?class="container">??
  96. ????????<div?class="box">??
  97. ????????????<div?class="cube"></div>??
  98. ????????</div>??
  99. ????</div>??
  100. </body>??
  101. ??
  102. </html>??


標(biāo)簽：

簡單有趣的CSS動(dòng)畫效果，翻滾的發(fā)光方塊～的評(píng)論 (共 條)

分享到微博請遵守國家法律
舒兰市| 玉屏| 嵩明县| 巴彦淖尔市| 乐昌市| 吴桥县| 昌图县| 安吉县| 崇文区| 岐山县| 仪陇县| 清新县| 怀仁县| 本溪| 凤庆县| 抚州市| 常宁市| 漳平市| 连州市| 山东| 象州县| 绍兴县| 静安区| 梨树县| 福贡县| 绍兴市| 洪湖市| 唐海县| 忻城县| 沈阳市| 江口县| 松原市| 永善县| 长海县| 金沙县| 屏东市| 大田县| 廊坊市| 陵水| 七台河市| 吉林省|