company_news.css 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. /*布局*/
  2. body{
  3. /*font:14px "宋体",Arial,Helvetica,sans-serif;*/
  4. /*font-family: FZY3JW--GB1-0;*/
  5. font-family: '思源宋体 CN Medium'; /*这里是说明调用来的字体名字*/
  6. src: url('../../../../data/font/SourceHanSerifCN-Medium.otf'); /*这里是字体文件路径*/
  7. color:#A1A1A1;
  8. margin:0;
  9. padding:0;
  10. /* background-image:linear-gradient(to top,#282828 0,#101010 100%); */
  11. min-width: 1280px;
  12. }
  13. ul,li,p,h1,h2,h3,h4,h5,h6,dl,dd{
  14. margin:0;
  15. padding:0;
  16. list-style:none;
  17. }
  18. .lf{float:left;}
  19. .rt{float:right;}
  20. .clear{clear:both;}
  21. img{
  22. /*width:1920px;*/
  23. /*height:568px;*/
  24. vertical-align:bottom;
  25. }
  26. a{
  27. color:#9A9A96;
  28. text-decoration:none!important;
  29. }
  30. a:hover{
  31. color:#D9D9D9;
  32. text-decoration:none!important;
  33. }
  34. /****整体布局****/
  35. /*header�����Ѿ�����*/
  36. .img{
  37. width: 100%;
  38. /*max-height: 544px;*/
  39. height: auto;
  40. }
  41. .img img{
  42. /*width: 100%;*/
  43. /*height: 544px;*/
  44. height: auto;
  45. width: 100%;
  46. max-width: 100%;
  47. max-height: 100%;
  48. }
  49. .company_text{
  50. width: 80%;
  51. height: 30px;
  52. /*background: yellow;*/
  53. margin-left: 10%;
  54. margin-top: 60px;
  55. font-size: 18px;
  56. letter-spacing: 3px;
  57. }
  58. .company_text p{
  59. font-size: 24px;
  60. }
  61. .company_dynamics{
  62. width: 80%;
  63. height: 39px;
  64. margin: 30px auto;
  65. border-bottom: 1px solid #DDDBDB;
  66. }
  67. .dynamics{
  68. width: 100px;
  69. height: 38px;
  70. line-height: 35px;
  71. text-align: center;
  72. font-size: 24px!important;
  73. font-weight: 500;
  74. border-bottom: 2px solid #989EEF;
  75. /*background: lightcoral;*/
  76. }
  77. .dynamics_img{
  78. width: 80%;
  79. height: 100%;
  80. margin: 0 auto;
  81. /*background: yellow;*/
  82. overflow: hidden;
  83. display: flex;
  84. display: -webkit-flex;
  85. /*justify-content: space-between;*/
  86. justify-content: flex-start;
  87. flex-wrap:wrap;
  88. }
  89. .dynamics_img div{
  90. width: 22%;
  91. height: 30%;
  92. float: left;
  93. /*position: relative;*/
  94. /*background: red;*/
  95. margin-bottom: 4%;
  96. margin-right: 4%;
  97. }
  98. .dynamics_img div:nth-child(4n){
  99. margin-right: 0;
  100. }
  101. .dynamics_img div img{
  102. width: 100%;
  103. max-width: 100%;
  104. max-height: 100%;
  105. border-radius: 8px;
  106. overflow: hidden;
  107. position: relative;
  108. z-index: 2;
  109. }
  110. .dynamics_img div p{
  111. width: 100%;
  112. height: 38px;
  113. line-height: 34px;
  114. /*position: absolute;*/
  115. /*top: 90%;*/
  116. /*left: 0;*/
  117. border-radius: 0 0 8px 8px;
  118. display: none;
  119. transition: all 2s linear;
  120. color: #fff;
  121. font-weight: bold;
  122. font-size: 14px;
  123. text-align: center;
  124. background: rgba(255,255,255,0.3);
  125. letter-spacing: 2px;
  126. position: relative;
  127. z-index: 5;
  128. margin-top: -38px;
  129. }
  130. .dynamics_img div:hover p{
  131. display: block;
  132. transition: all 2s linear;
  133. }
  134. .num{
  135. width:100%;
  136. height: 30px;
  137. /*background: orangered;*/
  138. margin: 40px auto
  139. }
  140. .num_btn{
  141. width: 360px;
  142. height: 30px;
  143. /*background: #000;*/
  144. margin: 0 auto;
  145. }
  146. .num_contain{
  147. width:80%;
  148. height: 30px;
  149. /*background: aqua;*/
  150. margin: 0 auto;
  151. }
  152. .num_contain>div{
  153. width: 350px;
  154. height: 30px;
  155. /*background: red;*/
  156. margin: 0 auto;
  157. }
  158. .num li{
  159. float: left;
  160. }
  161. .num li a{
  162. display: block;
  163. width: 30px;
  164. height: 30px;
  165. line-height: 30px;
  166. /*background: #000;*/
  167. margin: auto 10px;
  168. text-align: center;
  169. /*background: #F8F9FD;*/
  170. }
  171. .num li:nth-child(2) a{
  172. color: #757DEA;
  173. font-size: 24px;
  174. }