style.less 1.3KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109
  1. .print-page {
  2. width: 100%;
  3. height: 100%;
  4. position: relative;
  5. box-sizing: border-box;
  6. padding: 1cm;
  7. }
  8. // A4 大小 210 * 279
  9. @width: 190mm; // 210 - 20
  10. @height: 277mm; // 279 - 20
  11. @minWidth: calc(@width / 8);
  12. .print-table {
  13. table-layout: fixed;
  14. width: @width;
  15. height: @height;
  16. margin: auto;
  17. font-size: 16px;
  18. overflow-x: hidden;
  19. col {
  20. width: @minWidth;
  21. }
  22. th {
  23. font-weight: 400;
  24. }
  25. thead {
  26. tr {
  27. border: none !important;
  28. }
  29. }
  30. @border: 1.5px solid #333;
  31. tbody {
  32. border: @border;
  33. }
  34. tr {
  35. & + tr {
  36. border-top: @border;
  37. }
  38. }
  39. td {
  40. padding: 0 .5em;
  41. overflow: hidden;
  42. text-overflow: ellipsis;
  43. div {
  44. min-width: @minWidth;
  45. min-height: 10mm;
  46. line-height: 10mm;
  47. }
  48. & + td {
  49. border-left: @border;
  50. }
  51. }
  52. .cell-lg {
  53. div {
  54. width: auto;
  55. min-height: 70mm;
  56. line-height: 1.6em;
  57. }
  58. }
  59. .title {
  60. font-size: 2em;
  61. }
  62. .sub-title {
  63. // font-size: 12px;
  64. }
  65. .bd-left {
  66. border-left: @border;
  67. }
  68. }
  69. @media screen {
  70. .print-btn {
  71. text-align: center;
  72. margin: 64px auto;
  73. }
  74. .print-table {
  75. padding: 5mm 5mm 5mm 10mm;
  76. }
  77. }
  78. @media print {
  79. .print-table {
  80. padding: 0;
  81. }
  82. .print-btn {
  83. display: none;
  84. }
  85. }
  86. @page {
  87. size: A4;
  88. margin: 0;
  89. }