index2.scss 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. .page-body {
  2. display: flex;
  3. background: #fff;
  4. overflow: hidden;
  5. position: fixed;
  6. }
  7. .nav {
  8. display: flex;
  9. width: 100%;
  10. }
  11. .nav-left {
  12. width: 25%;
  13. background: #fafafa;
  14. }
  15. .nav-left-item {
  16. height: 100upx;
  17. border-right: solid 1px #f1f1f1;
  18. border-bottom: solid 1px #f1f1f1;
  19. font-size: 30upx;
  20. display: flex;
  21. align-items: center;
  22. justify-content: center;
  23. }
  24. .nav-left-item:last-child {
  25. border-bottom: none;
  26. }
  27. .nav-right {
  28. width: 75%;
  29. }
  30. .box {
  31. display: block;
  32. overflow: hidden;
  33. border-bottom: 20upx solid #f3f3f3;
  34. /* min-height: 100vh; */
  35. /*若您的子分类过少想使得每个子分类占满屏请放开上边注视 */
  36. }
  37. .box:last-child {
  38. border: none;
  39. min-height: 100vh;
  40. }
  41. .nav-right-item {
  42. // width: 30%;
  43. width:29%;
  44. min-height: 220upx;
  45. float: left;
  46. text-align: center;
  47. padding: 11upx;
  48. font-size: 28upx;
  49. }
  50. .nav-right-item image {
  51. width: 120upx;
  52. height: 120upx;
  53. }
  54. .active {
  55. color: #ff80ab;
  56. background: #fff;
  57. border-right: 0;
  58. }
  59. ::-webkit-scrollbar {
  60. width: 0;
  61. height: 0;
  62. color: transparent;
  63. }
  64. .right_item_name{
  65. width: 100%;
  66. // text-align: left;
  67. word-break: break-all;
  68. word-wrap: break-word;
  69. display: -webkit-box;
  70. -webkit-line-clamp: 2;
  71. -webkit-box-orient: vertical;
  72. overflow: hidden;
  73. }
  74. ::v-deep .u-sticky{
  75. top: 153rpx !important;
  76. }