table.scss 628 B

123456789101112131415161718192021222324252627282930313233343536373839
  1. $cellHeight: 30px;
  2. ul {
  3. list-style: none;
  4. margin: 0;
  5. padding: 0;
  6. }
  7. .box {
  8. width: 60%;
  9. margin: auto;
  10. }
  11. .header {
  12. display: flex;
  13. }
  14. .body {
  15. height: 5 * $cellHeight;
  16. overflow: hidden;
  17. // padding-bottom: 10px;
  18. li {
  19. display: flex;
  20. height: $cellHeight;
  21. }
  22. }
  23. .cell {
  24. flex: 1;
  25. height: $cellHeight;
  26. line-height: $cellHeight;
  27. border: 1px solid #e2e2e2;
  28. box-sizing: border-box;
  29. }
  30. .list {
  31. animation: scroll 10s linear infinite;
  32. position: relative;
  33. }
  34. @keyframes scroll {
  35. from { top: 0; }
  36. to { top: -20 * $cellHeight }
  37. }