index.less 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798
  1. @import 'reset';
  2. @import 'var';
  3. html,
  4. body,
  5. #app {
  6. width: 100%;
  7. height: 100%;
  8. // overflow: hidden;
  9. }
  10. body {
  11. min-width: 320px;
  12. // font-family: Arial;
  13. }
  14. // #app {
  15. // position: relative;
  16. // }
  17. .cover-img {
  18. width: 100%;
  19. height: 100%;
  20. object-fit: cover;
  21. }
  22. //浮动
  23. .fl {
  24. float: left;
  25. }
  26. .fr {
  27. float: right;
  28. }
  29. .pointer {
  30. cursor: pointer;
  31. }
  32. .hover {
  33. color: @text_color;
  34. cursor: pointer;
  35. &:hover {
  36. color: @text_color_active;
  37. }
  38. }
  39. .text-left {
  40. text-align: left;
  41. }
  42. .clearfix {
  43. &:after {
  44. display: block;
  45. content: '';
  46. clear: both;
  47. }
  48. }
  49. //滚动条
  50. ::-webkit-scrollbar {
  51. /*滚动条整体部分,其中的属性有width,height,background,border(就和一个块级元素一样)等*/
  52. background-color: rgba(0, 0, 0, 0.3);
  53. width: 5px; //纵向滚动条
  54. border-radius: 10px;
  55. }
  56. ::-webkit-scrollbar-button {
  57. /*滚动条两端的按钮。可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果。*/
  58. display: none;
  59. }
  60. ::-webkit-scrollbar-track {
  61. /*外层轨道。可以用display:none让其不显示,也可以添加背景图片,颜色改变显示效果。*/
  62. display: none;
  63. //background-color: rgba(255, 255, 255, 0.1);
  64. border-radius: 10px;
  65. }
  66. ::-webkit-scrollbar-track-piece {
  67. /*内层轨道,滚动条中间部分(除去)。*/
  68. //background-color: rgba(255, 255, 255, .1);
  69. border-radius: 10px;
  70. }
  71. ::-webkit-scrollbar-thumb {
  72. /*滚动条里面可以拖动的那部分*/
  73. background-color: rgba(255, 255, 255, 0.5);
  74. border-radius: 10px;
  75. }
  76. ::-webkit-scrollbar-corner {
  77. border-radius: 10px;
  78. }
  79. ::-webkit-resizer {
  80. /*定义右下角拖动块的样式*/
  81. border-radius: 10px;
  82. }