luckdraw.scss 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. .nut-luckdraw{
  2. position: absolute;
  3. left: 50%;
  4. top: 50%;
  5. transform: translate(-50%, -50%);
  6. text-align: center;
  7. // transform: translateZ(0);
  8. .drawTable-name {
  9. position: absolute;
  10. left: 10px;
  11. top: 20px;
  12. width: calc(100% - 20px);
  13. font-size: 12px;
  14. text-align: center;
  15. color: #ff5722;
  16. }
  17. .drawTable-img {
  18. position: absolute;
  19. /*要居中就要50% - 宽度 / 2*/
  20. left: calc(50% - 30px / 2);
  21. top: 60px;
  22. width: 30px;
  23. height: 30px;
  24. img {
  25. display: inline-block;
  26. width: 100%;
  27. height: 100%;
  28. }
  29. }
  30. .lucktable {
  31. position: absolute;
  32. left: 0;
  33. top: 0;
  34. width: 100%;
  35. height: 100%;
  36. }
  37. .prize {
  38. position: absolute;
  39. left: 25%;
  40. top: 0;
  41. width: 50%;
  42. height: 50%;
  43. .item {
  44. position: absolute;
  45. left: 0;
  46. top: 0;
  47. width: 100%;
  48. height: 100%;
  49. transform-origin: center bottom;
  50. }
  51. }
  52. }
  53. .pointer {
  54. position: absolute;
  55. // left: calc(50% - 35px);
  56. // top: calc(50% - 40px);
  57. left: 50%;
  58. top: 50%;
  59. transform: translate(-43.75%, -50%);
  60. }