newsDetails.css 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. .zskk-news {
  2. display: flex;
  3. flex-direction: column;
  4. align-items: center;
  5. background: #ffffff;
  6. min-height: calc(100vh - 367px);
  7. }
  8. .zskk-news .zskk-newsnav {
  9. height: 40px;
  10. width: 100%;
  11. background: #f0f0f0;
  12. display: flex;
  13. justify-content: center;
  14. }
  15. .zskk-news .zskk-newsnav .zskk-list {
  16. display: flex;
  17. align-items: center;
  18. padding: 0 20px;
  19. font-size: 16px;
  20. cursor: pointer;
  21. color: #a9a9a9;
  22. }
  23. .zskk-news .zskk-newsnav .zskk-active a {
  24. color: #e31445;
  25. }
  26. .zskk-news .zskk-newscontent {
  27. width: 1000px;
  28. display: flex;
  29. justify-content: space-between;
  30. padding: 30px 0 10px 0;
  31. }
  32. .zskk-news .zskk-newscontent .zskk-newsDetails {
  33. height: 100%;
  34. width: 600px;
  35. display: flex;
  36. flex-direction: column;
  37. min-height: calc(100vh - 447px);
  38. }
  39. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-title {
  40. color: #784726;
  41. font-weight: 600;
  42. font-size: 16px;
  43. }
  44. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-timebrowse {
  45. color: #a1aeb5;
  46. font-size: 12px;
  47. display: flex;
  48. align-items: flex-end;
  49. margin-top: 5px;
  50. }
  51. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-timebrowse .zskk-browse {
  52. display: flex;
  53. align-items: flex-end;
  54. margin-left: 20px;
  55. }
  56. .zskk-news
  57. .zskk-newscontent
  58. .zskk-newsDetails
  59. .zskk-timebrowse
  60. .zskk-browse
  61. img {
  62. margin-right: 5px;
  63. }
  64. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-content {
  65. box-sizing: border-box;
  66. padding: 30px 0;
  67. flex: 1;
  68. }
  69. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-page {
  70. display: flex;
  71. justify-content: space-between;
  72. color: #a1aeb5;
  73. font-size: 12px;
  74. }
  75. .zskk-news .zskk-newscontent .zskk-newsDetails .zskk-page .hide {
  76. visibility: hidden;
  77. }
  78. .zskk-news .zskk-newscontent .zskk-newsside {
  79. height: 100%;
  80. width: 260px;
  81. }
  82. .zskk-news .zskk-newscontent .zskk-newsside .zskk-newssidenav {
  83. margin-top: 40px;
  84. }
  85. .zskk-news .zskk-newscontent .zskk-newsside .zskk-newssidenav ul li {
  86. height: 24px;
  87. font-size: 14px;
  88. list-style: none;
  89. color: #616365;
  90. cursor: pointer;
  91. }
  92. .zskk-news .zskk-newscontent .zskk-newsside .zskk-newssidenav ul .zskk-active {
  93. color: #784726;
  94. }
  95. .zskk-news .zskk-newscontent .zskk-newsside .zskk-recommendtitle {
  96. margin-top: 20px;
  97. font-size: 15px;
  98. color: #616365;
  99. }
  100. .zskk-news .zskk-newscontent .zskk-newsside .zskk-recommend {
  101. border: 1px solid #ebeeef;
  102. margin-top: 10px;
  103. }
  104. .zskk-news .zskk-newscontent .zskk-newsside .zskk-recommend li {
  105. list-style: none;
  106. padding: 8px 12px;
  107. font-size: 12px;
  108. color: #616365;
  109. border-bottom: 1px solid #ebeeef;
  110. }
  111. .zskk-news
  112. .zskk-newscontent
  113. .zskk-newsside
  114. .zskk-recommend
  115. li:nth-last-child(1) {
  116. border: none;
  117. }
  118. /* <div class="zskk-newsside">
  119. <ul zskk-recommend>
  120. <li>发的发生的发送到发送到发送到?</li>
  121. <li>发的发生的发送到发送到发送到?</li>
  122. <li>发的发生的发送到发送到发送到?</li>
  123. <li>发的发生的发送到发送到发送到?</li>
  124. <li>发的发生的发送到发送到发送到?</li>
  125. <li>发的发生的发送到发送到发送到?</li>
  126. </ul>
  127. </div> */