zhongze
/
zhongze-front
İzle 5
Yıldızla 0
Çatalla 0
Kod Sorunlar 0 Değişiklik İstekleri 0 Sürümler 0 Wiki Aktivite
Kaynağa Gözat

修复bug

zjm
suomingxiang 10 ay önce
ebeveyn
07fea4fde3
işleme
d80b62ed06
10 değiştirilmiş dosya ile 371 ekleme ve 877 silme
Görünümü Böl Farklılık Durumunu Göster
  1. 3
    0
      src/pages/common/js/utils.js
  2. 2
    2
      src/pages/common/tpl/footer.tpl
  3. 2
    2
      src/pages/common/tpl/header.tpl
  4. 1
    1
      src/pages/news/App.js
  5. 3
    422
      src/pages/news/index.html
  6. 305
    445
      src/pages/news/index.less
  7. 2
    2
      src/pages/partyBuilding/index.html
  8. 50
    0
      src/pages/socialResponsibility/App.js
  9. 2
    2
      src/pages/socialResponsibility/index.html
  10. 1
    1
      src/pages/socialResponsibility/index.less

+ 3
- 0
src/pages/common/js/utils.js Dosyayı Görüntüle 

@@ -1,6 +1,9 @@
1 1 
 const BASEURL = '/api';
2 
+// const BASEURL = 'http://60.205.233.182/api';
2 3 
 // const BASEURL = 'http://192.168.1.63:6002/api';
3 4
5 
+
6 
+
4 7 
 async function fetchRequest(url, method = 'GET', data = null) {
5 8 
     const options = {
6 9 
         method: method,

+ 2
- 2
src/pages/common/tpl/footer.tpl Dosyayı Görüntüle 

@@ -49,8 +49,8 @@
49 49 
             <div class="footerClick">
50 50 
                 <a class="h7" href="./socialResponsibility.html"><span>社会责任</span></a>
51 51 
                 <span class="icon iconfont icon-arrow-right"></span>
52 
-                <div class="footerShow show2"><a class="h7R" href="./socialResponsibility.html"><span>社会公益</span></a>
53 
-                <a class="h7R" href="./socialResponsibility.html"><span>绿色转型</span></a></div>
52 
+                <div class="footerShow show2"><a class="h7R" href="./socialResponsibility.html#p1"><span>社会公益</span></a>
53 
+                <a class="h7R" href="./socialResponsibility.html#p1"><span>绿色转型</span></a></div>
54 54 
             </div>
55 55 
             <div class="footerClick">
56 56 
                 <a class="h7" href="./join.html"><span>加入中泽</span></a>

+ 2
- 2
src/pages/common/tpl/header.tpl Dosyayı Görüntüle 

@@ -50,8 +50,8 @@
50 50 
                 <a href="./socialResponsibility.html">社会责任</a>
51 51 
                 <div class="menuSon">
52 52 
                     <div class="menuUp"></div>
53 
-                    <a href="./socialResponsibility.html"><span>社会公益</span></a>
54 
-                    <a href="./socialResponsibility.html"><span>绿色转型</span></a>
53 
+                    <a href="./socialResponsibility.html#p1"><span>社会公益</span></a>
54 
+                    <a href="./socialResponsibility.html#p2"><span>绿色转型</span></a>
55 55 
                 </div>
56 56 
             </div>
57 57 
             <div class="menuOne">

+ 1
- 1
src/pages/news/App.js Dosyayı Görüntüle 

@@ -13,7 +13,7 @@ export default class App {
13 13 
         let common = new Common(document.querySelector('.main'),2)   //导航菜单高亮，0是首页，后面的按顺序添加
14 14 
         this.isMobile = isMobile()
15 15
16 
-        bindDom();
16 
+        // bindDom();
17 17
18 18 
         function bindDom(){
19 19 
             const tabs_ul =  document.querySelectorAll(".tabs_li");

+ 3
- 422
src/pages/news/index.html Dosyayı Görüntüle 

@@ -48,7 +48,7 @@
48 48 
                         <img src="./static/images/news/03.png" alt="">
49 49 
                         <div class="banner2_cont">
50 50 
                             <div class="txt1">交通运输部、国家发展改革委联合印发
51 
-                                《交通物流降本提质增效行动计化》</div>
51 
+                                《交通物流降本提质增效行sddsd动计化》</div>
52 52 
                             <div class="txt2">2024-11-18</div>
53 53 
                             <div class="txt3">《计划》提出，到2027年，交通物流降本提质增效取得显著成效，社会物流总费用与国内生产...</div>
54 54 
                             <a href="#">
 
@@ -66,321 +66,6 @@
66 66 
                     <a class="tabs_li">研发创新</a>
67 67 
                 </div>
68 68 
             </div>
69 
-            <div class="news_ul newsShow">
70 
-                <div class="news_list">
71 
-                    <div class="news_li">
72 
-                        <div class="li_left">
73 
-                            <div class="timerData">10</div>
74 
-                            <div>24-06</div>
75 
-                        </div>
76 
-                        <a class="li_cont" href="./articleDetails.html">
77 
-                            <div>0中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
78 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
79 
-                        </a>
80 
-                    </div>
81 
-                    <div class="news_li">
82 
-                        <div class="li_left">
83 
-                            <div class="timerData">10</div>
84 
-                            <div>24-06</div>
85 
-                        </div>
86 
-                        <a class="li_cont" href="#">
87 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
88 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
89 
-                        </a>
90 
-                    </div>
91 
-                    <div class="news_li">
92 
-                        <div class="li_left">
93 
-                            <div class="timerData">10</div>
94 
-                            <div>24-06</div>
95 
-                        </div>
96 
-                        <a class="li_cont" href="#">
97 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
98 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
99 
-                        </a>
100 
-                    </div>
101 
-                    <div class="news_li">
102 
-                        <div class="li_left">
103 
-                            <div class="timerData">10</div>
104 
-                            <div>24-06</div>
105 
-                        </div>
106 
-                        <a class="li_cont" href="./articleDetails.html">
107 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
108 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
109 
-                        </a>
110 
-                    </div>
111 
-                    <div class="news_li">
112 
-                        <div class="li_left">
113 
-                            <div class="timerData">10</div>
114 
-                            <div>24-06</div>
115 
-                        </div>
116 
-                        <a class="li_cont" href="#">
117 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
118 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
119 
-                        </a>
120 
-                    </div>
121 
-                    <div class="news_li">
122 
-                        <div class="li_left">
123 
-                            <div class="timerData">10</div>
124 
-                            <div>24-06</div>
125 
-                        </div>
126 
-                        <a class="li_cont" href="#">
127 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
128 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
129 
-                        </a>
130 
-                    </div>
131 
-                    <div class="news_li">
132 
-                        <div class="li_left">
133 
-                            <div class="timerData">10</div>
134 
-                            <div>24-06</div>
135 
-                        </div>
136 
-                        <a class="li_cont" href="./articleDetails.html">
137 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
138 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
139 
-                        </a>
140 
-                    </div>
141 
-                    <div class="news_li">
142 
-                        <div class="li_left">
143 
-                            <div class="timerData">10</div>
144 
-                            <div>24-06</div>
145 
-                        </div>
146 
-                        <a class="li_cont" href="#">
147 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
148 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
149 
-                        </a>
150 
-                    </div>
151 
-                    <div class="news_li">
152 
-                        <div class="li_left">
153 
-                            <div class="timerData">10</div>
154 
-                            <div>24-06</div>
155 
-                        </div>
156 
-                        <a class="li_cont" href="#">
157 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
158 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
159 
-                        </a>
160 
-                    </div>
161 
-                    <div class="news_li">
162 
-                        <div class="li_left">
163 
-                            <div class="timerData">10</div>
164 
-                            <div>24-06</div>
165 
-                        </div>
166 
-                        <a class="li_cont" href="./articleDetails.html">
167 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
168 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
169 
-                        </a>
170 
-                    </div>
171 
-                </div>
172 
-
173 
-            </div>
174 
-            <div class="news_ul">
175 
-                <div class="news_list">
176 
-                    <div class="news_li">
177 
-                        <div class="li_left">
178 
-                            <div class="timerData">10</div>
179 
-                            <div>24-06</div>
180 
-                        </div>
181 
-                        <a class="li_cont" href="./articleDetails.html">
182 
-                            <div>1中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
183 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
184 
-                        </a>
185 
-                    </div>
186 
-                    <div class="news_li">
187 
-                        <div class="li_left">
188 
-                            <div class="timerData">10</div>
189 
-                            <div>24-06</div>
190 
-                        </div>
191 
-                        <a class="li_cont" href="#">
192 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
193 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
194 
-                        </a>
195 
-                    </div>
196 
-                    <div class="news_li">
197 
-                        <div class="li_left">
198 
-                            <div class="timerData">10</div>
199 
-                            <div>24-06</div>
200 
-                        </div>
201 
-                        <a class="li_cont" href="#">
202 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
203 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
204 
-                        </a>
205 
-                    </div>
206 
-                    <div class="news_li">
207 
-                        <div class="li_left">
208 
-                            <div class="timerData">10</div>
209 
-                            <div>24-06</div>
210 
-                        </div>
211 
-                        <a class="li_cont" href="./articleDetails.html">
212 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
213 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
214 
-                        </a>
215 
-                    </div>
216 
-                    <div class="news_li">
217 
-                        <div class="li_left">
218 
-                            <div class="timerData">10</div>
219 
-                            <div>24-06</div>
220 
-                        </div>
221 
-                        <a class="li_cont" href="#">
222 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
223 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
224 
-                        </a>
225 
-                    </div>
226 
-                    <div class="news_li">
227 
-                        <div class="li_left">
228 
-                            <div class="timerData">10</div>
229 
-                            <div>24-06</div>
230 
-                        </div>
231 
-                        <a class="li_cont" href="#">
232 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
233 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
234 
-                        </a>
235 
-                    </div>
236 
-                    <div class="news_li">
237 
-                        <div class="li_left">
238 
-                            <div class="timerData">10</div>
239 
-                            <div>24-06</div>
240 
-                        </div>
241 
-                        <a class="li_cont" href="./articleDetails.html">
242 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
243 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
244 
-                        </a>
245 
-                    </div>
246 
-                    <div class="news_li">
247 
-                        <div class="li_left">
248 
-                            <div class="timerData">10</div>
249 
-                            <div>24-06</div>
250 
-                        </div>
251 
-                        <a class="li_cont" href="#">
252 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
253 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
254 
-                        </a>
255 
-                    </div>
256 
-                    <div class="news_li">
257 
-                        <div class="li_left">
258 
-                            <div class="timerData">10</div>
259 
-                            <div>24-06</div>
260 
-                        </div>
261 
-                        <a class="li_cont" href="#">
262 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
263 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
264 
-                        </a>
265 
-                    </div>
266 
-                    <div class="news_li">
267 
-                        <div class="li_left">
268 
-                            <div class="timerData">10</div>
269 
-                            <div>24-06</div>
270 
-                        </div>
271 
-                        <a class="li_cont" href="./articleDetails.html">
272 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
273 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
274 
-                        </a>
275 
-                    </div>
276 
-                </div>
277 
-
278 
-            </div>
279 
-            <div class="news_ul">
280 
-                <div class="news_list">
281 
-                    <div class="news_li">
282 
-                        <div class="li_left">
283 
-                            <div class="timerData">10</div>
284 
-                            <div>24-06</div>
285 
-                        </div>
286 
-                        <a class="li_cont" href="./articleDetails.html">
287 
-                            <div>2中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
288 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
289 
-                        </a>
290 
-                    </div>
291 
-                    <div class="news_li">
292 
-                        <div class="li_left">
293 
-                            <div class="timerData">10</div>
294 
-                            <div>24-06</div>
295 
-                        </div>
296 
-                        <a class="li_cont" href="#">
297 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
298 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
299 
-                        </a>
300 
-                    </div>
301 
-                    <div class="news_li">
302 
-                        <div class="li_left">
303 
-                            <div class="timerData">10</div>
304 
-                            <div>24-06</div>
305 
-                        </div>
306 
-                        <a class="li_cont" href="#">
307 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
308 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
309 
-                        </a>
310 
-                    </div>
311 
-                    <div class="news_li">
312 
-                        <div class="li_left">
313 
-                            <div class="timerData">10</div>
314 
-                            <div>24-06</div>
315 
-                        </div>
316 
-                        <a class="li_cont" href="./articleDetails.html">
317 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
318 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
319 
-                        </a>
320 
-                    </div>
321 
-                    <div class="news_li">
322 
-                        <div class="li_left">
323 
-                            <div class="timerData">10</div>
324 
-                            <div>24-06</div>
325 
-                        </div>
326 
-                        <a class="li_cont" href="#">
327 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
328 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
329 
-                        </a>
330 
-                    </div>
331 
-                    <div class="news_li">
332 
-                        <div class="li_left">
333 
-                            <div class="timerData">10</div>
334 
-                            <div>24-06</div>
335 
-                        </div>
336 
-                        <a class="li_cont" href="#">
337 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
338 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
339 
-                        </a>
340 
-                    </div>
341 
-                    <div class="news_li">
342 
-                        <div class="li_left">
343 
-                            <div class="timerData">10</div>
344 
-                            <div>24-06</div>
345 
-                        </div>
346 
-                        <a class="li_cont" href="./articleDetails.html">
347 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
348 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
349 
-                        </a>
350 
-                    </div>
351 
-                    <div class="news_li">
352 
-                        <div class="li_left">
353 
-                            <div class="timerData">10</div>
354 
-                            <div>24-06</div>
355 
-                        </div>
356 
-                        <a class="li_cont" href="#">
357 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
358 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
359 
-                        </a>
360 
-                    </div>
361 
-                    <div class="news_li">
362 
-                        <div class="li_left">
363 
-                            <div class="timerData">10</div>
364 
-                            <div>24-06</div>
365 
-                        </div>
366 
-                        <a class="li_cont" href="#">
367 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
368 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
369 
-                        </a>
370 
-                    </div>
371 
-                    <div class="news_li">
372 
-                        <div class="li_left">
373 
-                            <div class="timerData">10</div>
374 
-                            <div>24-06</div>
375 
-                        </div>
376 
-                        <a class="li_cont" href="./articleDetails.html">
377 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
378 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
379 
-                        </a>
380 
-                    </div>
381 
-                </div>
382 
-
383 
-            </div>
384 69 
             <div class="news_ul">
385 70 
                 <div class="news_list">
386 71 
                     <div class="news_li">
 
@@ -389,112 +74,7 @@
389 74 
                             <div>24-06</div>
390 75 
                         </div>
391 76 
                         <a class="li_cont" href="./articleDetails.html">
392 
-                            <div>3中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
393 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
394 
-                        </a>
395 
-                    </div>
396 
-                    <div class="news_li">
397 
-                        <div class="li_left">
398 
-                            <div class="timerData">10</div>
399 
-                            <div>24-06</div>
400 
-                        </div>
401 
-                        <a class="li_cont" href="#">
402 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
403 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
404 
-                        </a>
405 
-                    </div>
406 
-                    <div class="news_li">
407 
-                        <div class="li_left">
408 
-                            <div class="timerData">10</div>
409 
-                            <div>24-06</div>
410 
-                        </div>
411 
-                        <a class="li_cont" href="#">
412 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
413 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
414 
-                        </a>
415 
-                    </div>
416 
-                    <div class="news_li">
417 
-                        <div class="li_left">
418 
-                            <div class="timerData">10</div>
419 
-                            <div>24-06</div>
420 
-                        </div>
421 
-                        <a class="li_cont" href="./articleDetails.html">
422 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
423 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
424 
-                        </a>
425 
-                    </div>
426 
-                    <div class="news_li">
427 
-                        <div class="li_left">
428 
-                            <div class="timerData">10</div>
429 
-                            <div>24-06</div>
430 
-                        </div>
431 
-                        <a class="li_cont" href="#">
432 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
433 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
434 
-                        </a>
435 
-                    </div>
436 
-                    <div class="news_li">
437 
-                        <div class="li_left">
438 
-                            <div class="timerData">10</div>
439 
-                            <div>24-06</div>
440 
-                        </div>
441 
-                        <a class="li_cont" href="#">
442 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
443 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
444 
-                        </a>
445 
-                    </div>
446 
-                    <div class="news_li">
447 
-                        <div class="li_left">
448 
-                            <div class="timerData">10</div>
449 
-                            <div>24-06</div>
450 
-                        </div>
451 
-                        <a class="li_cont" href="./articleDetails.html">
452 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
453 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
454 
-                        </a>
455 
-                    </div>
456 
-                    <div class="news_li">
457 
-                        <div class="li_left">
458 
-                            <div class="timerData">10</div>
459 
-                            <div>24-06</div>
460 
-                        </div>
461 
-                        <a class="li_cont" href="#">
462 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
463 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
464 
-                        </a>
465 
-                    </div>
466 
-                    <div class="news_li">
467 
-                        <div class="li_left">
468 
-                            <div class="timerData">10</div>
469 
-                            <div>24-06</div>
470 
-                        </div>
471 
-                        <a class="li_cont" href="#">
472 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
473 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
474 
-                        </a>
475 
-                    </div>
476 
-                    <div class="news_li">
477 
-                        <div class="li_left">
478 
-                            <div class="timerData">10</div>
479 
-                            <div>24-06</div>
480 
-                        </div>
481 
-                        <a class="li_cont" href="./articleDetails.html">
482 
-                            <div>中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
483 
-                            <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
484 
-                        </a>
485 
-                    </div>
486 
-                </div>
487 
-
488 
-            </div>
489 
-            <div class="news_ul">
490 
-                <div class="news_list">
491 
-                    <div class="news_li">
492 
-                        <div class="li_left">
493 
-                            <div class="timerData">10</div>
494 
-                            <div>24-06</div>
495 
-                        </div>
496 
-                        <a class="li_cont" href="./articleDetails.html">
497 
-                            <div>4中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
77 
+                            <div>0中共中央办公厅 国务院办公厅关于推进新型城市基础设施建设打造韧性城市的意见</div>
498 78 
                             <div>为深化城市安全韧性提升行动，推进数字化、网络化、智能化新型城市基础设施建设，打造承受适应能力强、恢复速度快的韧性城市，增强城市风险防控和治理能力，经党...</div>
499 79 
                         </a>
500 80 
                     </div>
 
@@ -591,6 +171,7 @@
591 171 
                 </div>
592 172
593 173 
             </div>
174 
+
594 175 
             <div class="news_paging">
595 176 
                 <a id="previousPage" class="previousPage">
596 177 
                    <span class="icon iconfont icon-jiantou"></span>

+ 305
- 445
src/pages/news/index.less Dosyayı Görüntüle 

@@ -35,7 +35,7 @@
35 35 
             margin-bottom: 120px;
36 36 
             .news_banner{
37 37 
                 width: 750px;
38 
-                height: 512px;
38 
+                height: 523px;
39 39 
                 position: relative;
40 40 
                 img{
41 41 
                     width: 100%;
 
@@ -84,14 +84,19 @@
84 84 
                     font-size: 20px;
85 85 
                     color: #333333;
86 86 
                     line-height: 30px;
87 
-                    padding-bottom: 20px;
88 
-                    border-bottom: 1px solid #E7E7E7;
89 87 
                     margin-bottom: 20px;
88 
+                    display: -webkit-box;        /* 使用 Flexbox 布局 */
89 
+                    -webkit-box-orient: vertical; /* 垂直方向排列 */
90 
+                    -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
91 
+                    overflow: hidden;            /* 隐藏超出部分 */
92 
+                    text-overflow: ellipsis;
90 93 
                 }
91 94 
                 .txt2{
92 95 
                     font-size: 16px;
93 96 
                     color: #333333;
94 97 
                     margin-bottom: 20px;
98 
+                    border-top: 1px solid #E7E7E7;
99 
+                    padding-top: 20px;
95 100 
                 }
96 101 
                 .txt3{
97 102 
                     font-size: 16px;
 
@@ -108,13 +113,20 @@
108 113 
                     color: #333333;
109 114 
                     display: flex;
110 115 
                     align-items: center;
116 
+                    transition: all .2s;
111 117 
                     .icon{
112 118 
                         transform: rotate(90deg);
113 119 
                         display: inline-block;
114 120 
                         color: #000000;
115 121 
                         font-size: 24px;
116 
-                        margin-top: 5px;
117 122 
                         margin-left: 5px;
123 
+                        transition: all .2s;
124 
+                    }
125 
+                    &:hover{
126 
+                        color: #b81c25;
127 
+                        .icon{
128 
+                            color: #b81c25;
129 
+                        }
118 130 
                     }
119 131 
                 }
120 132 
             }
 
@@ -168,13 +180,13 @@
168 180 
         max-width: 1920px;
169 181 
         margin: 0 auto;
170 182 
         background: #F6F6F6;
171 
-        display: none;
172 183 
         .news_list{
173 184 
             width: 1300px;
174 185 
             margin: 0 auto;
175 186 
             .news_li{
176 187 
                 display: flex;
177 188 
                 align-items: center;
189 
+                justify-content: space-between;
178 190 
                 padding: 40px 0;
179 191 
                 border-bottom:1px solid #DADADA;
180 192 
                 transition: all .2s;
 
@@ -187,7 +199,6 @@
187 199 
                     font-size: 12px;
188 200 
                     padding: 0px 12px 0;
189 201 
                     box-sizing: border-box;
190 
-                    margin-right: 30px;
191 202 
                     .timerData{
192 203 
                       font-size: 26px;
193 204 
                       color: #b81c25;
 
@@ -237,7 +248,7 @@
237 248 
                 .li_cont{
238 249 
                     font-weight: 400;
239 250 
                     transition: all .2s;
240 
-
251 
+                    width: 93%;
241 252 
                     div:nth-child(1){
242 253 
                         font-weight: 500;
243 254 
                         font-size: 20px;
 
@@ -371,527 +382,376 @@ a{
371 382 
     display: inline-block;
372 383 
 }
373 384
374 
-@media screen and (min-width: 801px) and (max-width: 1400px) {
375 
-    // .main{
376 
-    //     .content{
377 
-    //         width: calc(100% - 60px);
378 
-    //         .banner_box{
379 
-    //             .news_banner{
380 
-    //                 width: 630px;
381 
-    //                 height: 413px;
382 
-    //                 .news_content{
383 
-    //                     border-radius: 12px;
384 
-    //                 }
385 
-    //             }
386 
-    //             .news_banner2{
387 
-    //                 width: 300px;
388 
-    //                 img{
389 
-    //                     height: 200px;
390 
-    //                 }
391 
-    //                 .txt1{
392 
-    //                     font-size: 16px;
393 
-    //                 }
394 
-    //                 .txt2{
395 
-    //                     font-size: 14px;
396 
-    //                 }
397 
-    //                 .txt3{
398 
-    //                     font-size: 14px;
399 
-    //                 }
400 
-    //                 a{
401 
-    //                     font-size: 14px;
402 
-    //                     .icon{
403 
-    //                         margin-top: -2px;
404 
-    //                         font-size: 18px;
405 
-    //                     }
406 
-    //                 }
407 
-    //             }
408 
-    //         }
409 
-    //         .tabs_box{
410 
-    //             width: calc(100% - 60px);
411 
-    //         }
412 
-    //     }
413 
-    //     .news_ul {
414 
-    //         max-width: 100%;
415 
-    //         width: calc(100% - 60px);
416 
-    //         overflow: hidden;
417 
-    //         .news_list{
418 
-    //             width: calc(100% - 60px);
419 
-    //         }
420 
-    //     }
421 
-    //     .news_paging{}
422 
-    // }
423 
-    .main {
424 
-        width: 100%;
425 
-        padding-top: 14.5vw;
385 
+// @media screen and (min-width: 808px) and (max-width: 1180px){
386 
+//     .main{
387 
+//         .content{
388 
+//             width: calc(100% - 60px);
389 
+//             .banner_box{
390 
+//                 .news_banner{
391 
+//                     width: 430px;
392 
+//                     height: 213px;
393 
+//                     .news_content{
394 
+//                         border-radius: 12px;
395 
+//                     }
396 
+//                 }
397 
+//                 .news_banner2{
398 
+//                     width: 300px;
399 
+//                     img{
400 
+//                         height: 200px;
401 
+//                     }
402 
+//                     .txt1{
403 
+//                         font-size: 16px;
404 
+//                     }
405 
+//                     .txt2{
406 
+//                         font-size: 14px;
407 
+//                     }
408 
+//                     .txt3{
409 
+//                         font-size: 14px;
410 
+//                     }
411 
+//                     a{
412 
+//                         font-size: 14px;
413 
+//                         .icon{
414 
+//                             margin-top: -2px;
415 
+//                             font-size: 18px;
416 
+//                         }
417 
+//                     }
418 
+//                 }
419 
+//             }
420 
+//             .tabs_box{
421 
+//                 width: calc(100% - 60px);
422 
+//             }
423 
+//         }
424 
+//         .news_ul {
425 
+//             max-width: 100%;
426 
+//             width: calc(100% - 60px);
427 
+//             overflow: hidden;
428 
+//             .news_list{
429 
+//                 width: calc(100% - 60px);
430 
+//             }
431 
+//         }
432 
+//         .news_paging{}
433 
+//     }
434 
+// }
435 
+@media screen and (min-width: 808px) and (max-width: 1400px) {
436 
+    .main{
426 437 
         .content{
427 
-            width: 92vw;
428 
-            margin: 0 auto;
429 
-            .news_title{
430 
-                display: block;
431 
-                margin-bottom: 12.5vw;
432 
-                padding-top: 50px;
433 
-                .title{
434 
-                    font-size: 32px;
435 
-                    text-align: center;
436 
-                }
437 
-                .title_screen{
438 
-                    margin-top: 10.625vw;
439 
-                    .screen_li{
440 
-                        width: 44.625vw;
441 
-                        height: 9.375vw;
442 
-                        font-size: 3.5vw;
443 
-                        .screen_box{
444 
-                            .screen_box_li{
445 
-                                font-size: 3.5vw;
446 
-                                height: 8vw;
447 
-                                line-height: 8vw;
448 
-                            }
449 
-                        }
450 
-                        svg{
451 
-                            width:5.5vw;
452 
-                            height: 4vw;
453 
-                        }
454 
-                    }
455 
-                }
456 
-            }
438 
+            width: calc(100% - 60px);
457 439 
             .banner_box{
458 
-                display: block;
459 
-                margin-bottom: 15vw;
460 440 
                 .news_banner{
461 
-                    width: 100%;
462 
-                    height: auto;
463 
-                    margin-bottom: 8vw;
464 
-
465 
-                    img{
466 
-                        width: 100%;
467 
-                        height: 62.75vw;
468 
-                        border-radius: 1.625vw;
469 
-                        object-fit: cover;
470 
-                    }
471 
-
441 
+                    width: 630px;
442 
+                    height: 413px;
472 443 
                     .news_content{
473 
-                        padding: 3.75vw;
474 
-                        display: flex;
475 
-                        flex-wrap: wrap;
476 
-                        flex-direction: column-reverse;
477 
-                        .cont1{
478 
-                            font-weight: bold;
479 
-                            font-size: 3.75vw;
480 
-                            color: #fff;
481 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
482 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
483 
-                            -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
484 
-                            overflow: hidden;            /* 隐藏超出部分 */
485 
-                            text-overflow: ellipsis;     /* 用省略号表示超出部分 */
486 
-                        }
487 
-                        .cont2{
488 
-                            width: 100%;
489 
-                            font-size: 3.375vw;
490 
-                            color: #fff;
491 
-                            margin-bottom: 2.5vw;
492 
-                        }
493 
-                        .cont3{
494 
-                            font-size: 3.25vw;
495 
-                            color: #fff;
496 
-                        }
444 
+                        border-radius: 12px;
497 445 
                     }
498 
-
499 
-                }
446 
+                }
500 447 
                 .news_banner2{
501 
-                    width: 100%;
502 
-                    display: flex;
503 
-                    align-items: center;
504 
-                    justify-content: space-between;
505 
-                    margin-bottom: 10.75vw;
448 
+                    width: 300px;
506 449 
                     img{
507 
-                        width: 45.375vw;
508 
-                        height: 34vw;
509 
-                        margin-bottom: 0;
510 
-                        border-radius: 1.625vw;
511 
-                    }
512 
-                    .banner2_cont{
513 
-                        width: 42.5vw;
450 
+                        height: 200px;
514 451 
                     }
515 452 
                     .txt1{
516 
-                        width: 42.5vw;
517 
-                        font-size: 3.75vw;
518 
-                        display: -webkit-box;           /* 使用 Flexbox 布局 */
519 
-                        -webkit-box-orient: vertical;   /* 垂直方向排列 */
520 
-                        -webkit-line-clamp: 2;         /* 限制显示的行数，这里是3行 */
521 
-                        overflow: hidden;               /* 隐藏超出部分 */
522 
-                        text-overflow: ellipsis;
523 
-                        line-height: 1.5;
524 
-                        padding-bottom: 0;
525 
-                        margin-bottom: 5.375vw;
526 
-                        border: 0;
453 
+                        font-size: 16px;
527 454 
                     }
528 455 
                     .txt2{
529 
-                        margin-bottom: 5.5vw;
530 
-                        font-size: 3.25vw;
531 
-                        color: #999999;
456 
+                        font-size: 14px;
532 457 
                     }
533 458 
                     .txt3{
534 
-                        display: none;
459 
+                        font-size: 14px;
535 460 
                     }
536 461 
                     a{
537 
-                        font-size: 3.325vw;
462 
+                        font-size: 14px;
538 463 
                         .icon{
539 
-                            font-size: 4.325vw;
540 
-                            margin-top: 0;
464 
+                            margin-top: -2px;
465 
+                            font-size: 18px;
541 466 
                         }
542 467 
                     }
543 468 
                 }
544 469 
             }
545 470 
             .tabs_box{
546 
-                width: 100%;
547 
-                font-size: 3.75vw;
548 
-                display: flex;
549 
-                align-items: center;
550 
-                justify-content: space-between;
551 
-                .tabs_li{
552 
-                    margin-right: 0;
553 
-                    padding-bottom: 5.625vw;
554 
-                }
471 
+                width: calc(100% - 60px);
555 472 
             }
556 473 
         }
557 
-        .news_ul{
474 
+        .news_ul {
475 
+            max-width: 100%;
476 
+            // width: calc(100% - 60px);
558 477 
             width: 100%;
478 
+            padding: 0 30px;
479 
+            overflow: hidden;
480 
+            box-sizing: border-box;
559 481 
             .news_list{
560 
-                margin-top: 0;
561 
-                width: 100%;
562 
-                box-sizing: border-box;
563 
-                padding: 0 3.75vw;
564 
-                .news_li{
565 
-                    padding:5.625vw 0;
566 
-                    display: flex;
567 
-                    align-items: center;
568 
-                    justify-content: space-between;
569 
-                    .li_left{
570 
-                        width: 16.25vw;
571 
-                        height: 16.25vw;
572 
-                        margin-right: 0;
573 
-                        font-size: 3.5vw;
574 
-
575 
-                        .timerData{
576 
-                            font-size: 3.5vw;
577 
-                            padding-top: 3vw;
578 
-                            padding-bottom: 2vw;
579 
-                        }
580 
-                    }
581 
-                    .li_cont{
582 
-                        width: 71.5vw;
583 
-                        div:nth-child(1){
584 
-                            font-size: 3.75vw;
585 
-                            color: #282828;
586 
-                            line-height: 7.5vw;
587 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
588 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
589 
-                            -webkit-line-clamp: 1;      /* 限制显示的行数，这里是3行 */
590 
-                            overflow: hidden;
591 
-                            font-weight: bold;
592 
-                        }
593 
-                        div:nth-child(2){
594 
-                            width: auto;
595 
-                            height: auto;
596 
-                            overflow: unset;
597 
-                            line-height: 1.5;
598 
-                            font-size: 3.25vw;
599 
-                            color: #A7A5A5;
600 
-                            padding: 0;
601 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
602 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
603 
-                            -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
604 
-                            overflow: hidden;
605 
-                        }
606 
-
607 
-                    }
608 
-                }
609 
-            }
610 
-        }
611 
-        .news_paging{
612 
-            padding-top: 16vw;
613 
-            .previousPage{
614 
-                width: 40px;
615 
-                height: 40px;
616 
-                margin-right: 20px;
617 
-                box-sizing: border-box;
618 
-            }
619 
-            .nextPage{
620 
-                width: 40px;
621 
-                height: 40px;
622 
-                margin-left: 3.25vw;
623 
-                transition: all 0.2s;
624 
-                box-sizing: border-box;
625 
-            }
626 
-            .pageNum{
627 
-                font-size: 3.5vw;
628 
-            }
629 
-            .ellipsis{
630 
-                font-size: 3.5vw;
631 
-                padding: 1.875vw 2.5vw;
632 
-                // &:hover{
633 
-                //     color:#48A038
634 
-                // }
482 
+                width: calc(100% - 60px);
635 483 
             }
636 484 
         }
485 
+        .news_paging{}
637 486 
     }
638 
-}
639 
-@media screen and (min-width: 1400px) and (max-width: 1600px) {
640 
-    // .main{
487 
+    // .main {
488 
+    //     width: 100%;
489 
+    //     padding-top: 14.5vw;
641 490 
     //     .content{
642 
-    //         width: calc(100% - 60px);
491 
+    //         width: 92vw;
492 
+    //         margin: 0 auto;
493 
+    //         .news_title{
494 
+    //             display: block;
495 
+    //             margin-bottom: 12.5vw;
496 
+    //             padding-top: 50px;
497 
+    //             .title{
498 
+    //                 font-size: 32px;
499 
+    //                 text-align: center;
500 
+    //             }
501 
+    //             .title_screen{
502 
+    //                 margin-top: 10.625vw;
503 
+    //                 .screen_li{
504 
+    //                     width: 44.625vw;
505 
+    //                     height: 9.375vw;
506 
+    //                     font-size: 3.5vw;
507 
+    //                     .screen_box{
508 
+    //                         .screen_box_li{
509 
+    //                             font-size: 3.5vw;
510 
+    //                             height: 8vw;
511 
+    //                             line-height: 8vw;
512 
+    //                         }
513 
+    //                     }
514 
+    //                     svg{
515 
+    //                         width:5.5vw;
516 
+    //                         height: 4vw;
517 
+    //                     }
518 
+    //                 }
519 
+    //             }
520 
+    //         }
643 521 
     //         .banner_box{
522 
+    //             display: block;
523 
+    //             margin-bottom: 15vw;
644 524 
     //             .news_banner{
645 
-    //                 width: 690px;
646 
-    //                 height: 455px;
525 
+    //                 width: 100%;
526 
+    //                 height: auto;
527 
+    //                 margin-bottom: 8vw;
528 
+
529 
+    //                 img{
530 
+    //                     width: 100%;
531 
+    //                     height: 62.75vw;
532 
+    //                     border-radius: 1.625vw;
533 
+    //                     object-fit: cover;
534 
+    //                 }
535 
+
647 536 
     //                 .news_content{
648 
-    //                     border-radius: 12px;
537 
+    //                     padding: 3.75vw;
538 
+    //                     display: flex;
539 
+    //                     flex-wrap: wrap;
540 
+    //                     flex-direction: column-reverse;
541 
+    //                     .cont1{
542 
+    //                         font-weight: bold;
543 
+    //                         font-size: 3.75vw;
544 
+    //                         color: #fff;
545 
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
546 
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
547 
+    //                         -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
548 
+    //                         overflow: hidden;            /* 隐藏超出部分 */
549 
+    //                         text-overflow: ellipsis;     /* 用省略号表示超出部分 */
550 
+    //                     }
551 
+    //                     .cont2{
552 
+    //                         width: 100%;
553 
+    //                         font-size: 3.375vw;
554 
+    //                         color: #fff;
555 
+    //                         margin-bottom: 2.5vw;
556 
+    //                     }
557 
+    //                     .cont3{
558 
+    //                         font-size: 3.25vw;
559 
+    //                         color: #fff;
560 
+    //                     }
649 561 
     //                 }
650 
-    //             }
562 
+
563 
+    //             }
651 564 
     //             .news_banner2{
652 
-    //                 width: 330px;
565 
+    //                 width: 100%;
566 
+    //                 display: flex;
567 
+    //                 align-items: center;
568 
+    //                 justify-content: space-between;
569 
+    //                 margin-bottom: 10.75vw;
653 570 
     //                 img{
654 
-    //                     height: 200px;
571 
+    //                     width: 45.375vw;
572 
+    //                     height: 34vw;
573 
+    //                     margin-bottom: 0;
574 
+    //                     border-radius: 1.625vw;
575 
+    //                 }
576 
+    //                 .banner2_cont{
577 
+    //                     width: 42.5vw;
655 578 
     //                 }
656 579 
     //                 .txt1{
657 
-    //                     font-size: 16px;
580 
+    //                     width: 42.5vw;
581 
+    //                     font-size: 3.75vw;
582 
+    //                     display: -webkit-box;           /* 使用 Flexbox 布局 */
583 
+    //                     -webkit-box-orient: vertical;   /* 垂直方向排列 */
584 
+    //                     -webkit-line-clamp: 2;         /* 限制显示的行数，这里是3行 */
585 
+    //                     overflow: hidden;               /* 隐藏超出部分 */
586 
+    //                     text-overflow: ellipsis;
587 
+    //                     line-height: 1.5;
588 
+    //                     padding-bottom: 0;
589 
+    //                     margin-bottom: 5.375vw;
590 
+    //                     border: 0;
658 591 
     //                 }
659 592 
     //                 .txt2{
660 
-    //                     font-size: 14px;
593 
+    //                     margin-bottom: 5.5vw;
594 
+    //                     font-size: 3.25vw;
595 
+    //                     color: #999999;
661 596 
     //                 }
662 597 
     //                 .txt3{
663 
-    //                     font-size: 14px;
598 
+    //                     display: none;
664 599 
     //                 }
665 600 
     //                 a{
666 
-    //                     font-size: 14px;
601 
+    //                     font-size: 3.325vw;
667 602 
     //                     .icon{
668 
-    //                         margin-top: -2px;
669 
-    //                         font-size: 18px;
603 
+    //                         font-size: 4.325vw;
604 
+    //                         margin-top: 0;
670 605 
     //                     }
671 606 
     //                 }
672 607 
     //             }
673 608 
     //         }
674 609 
     //         .tabs_box{
675 
-    //             width: calc(100% - 60px);
610 
+    //             width: 100%;
611 
+    //             font-size: 3.75vw;
612 
+    //             display: flex;
613 
+    //             align-items: center;
614 
+    //             justify-content: space-between;
615 
+    //             .tabs_li{
616 
+    //                 margin-right: 0;
617 
+    //                 padding-bottom: 5.625vw;
618 
+    //             }
676 619 
     //         }
677 620 
     //     }
678 
-    //     .news_ul {
679 
-    //         max-width: 100%;
680 
-    //         width: calc(100% - 60px);
681 
-    //         overflow: hidden;
621 
+    //     .news_ul{
622 
+    //         width: 100%;
682 623 
     //         .news_list{
683 
-    //             width: calc(100% - 60px);
624 
+    //             margin-top: 0;
625 
+    //             width: 100%;
626 
+    //             box-sizing: border-box;
627 
+    //             padding: 0 3.75vw;
628 
+    //             .news_li{
629 
+    //                 padding:5.625vw 0;
630 
+    //                 display: flex;
631 
+    //                 align-items: center;
632 
+    //                 justify-content: space-between;
633 
+    //                 .li_left{
634 
+    //                     width: 16.25vw;
635 
+    //                     height: 16.25vw;
636 
+    //                     margin-right: 0;
637 
+    //                     font-size: 3.5vw;
638 
+
639 
+    //                     .timerData{
640 
+    //                         font-size: 3.5vw;
641 
+    //                         padding-top: 3vw;
642 
+    //                         padding-bottom: 2vw;
643 
+    //                     }
644 
+    //                 }
645 
+    //                 .li_cont{
646 
+    //                     width: 71.5vw;
647 
+    //                     div:nth-child(1){
648 
+    //                         font-size: 3.75vw;
649 
+    //                         color: #282828;
650 
+    //                         line-height: 7.5vw;
651 
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
652 
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
653 
+    //                         -webkit-line-clamp: 1;      /* 限制显示的行数，这里是3行 */
654 
+    //                         overflow: hidden;
655 
+    //                         font-weight: bold;
656 
+    //                     }
657 
+    //                     div:nth-child(2){
658 
+    //                         width: auto;
659 
+    //                         height: auto;
660 
+    //                         overflow: unset;
661 
+    //                         line-height: 1.5;
662 
+    //                         font-size: 3.25vw;
663 
+    //                         color: #A7A5A5;
664 
+    //                         padding: 0;
665 
+    //                         display: -webkit-box;        /* 使用 Flexbox 布局 */
666 
+    //                         -webkit-box-orient: vertical; /* 垂直方向排列 */
667 
+    //                         -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
668 
+    //                         overflow: hidden;
669 
+    //                     }
670 
+
671 
+    //                 }
672 
+    //             }
673 
+    //         }
674 
+    //     }
675 
+    //     .news_paging{
676 
+    //         padding-top: 16vw;
677 
+    //         .previousPage{
678 
+    //             width: 40px;
679 
+    //             height: 40px;
680 
+    //             margin-right: 20px;
681 
+    //             box-sizing: border-box;
682 
+    //         }
683 
+    //         .nextPage{
684 
+    //             width: 40px;
685 
+    //             height: 40px;
686 
+    //             margin-left: 3.25vw;
687 
+    //             transition: all 0.2s;
688 
+    //             box-sizing: border-box;
689 
+    //         }
690 
+    //         .pageNum{
691 
+    //             font-size: 3.5vw;
692 
+    //         }
693 
+    //         .ellipsis{
694 
+    //             font-size: 3.5vw;
695 
+    //             padding: 1.875vw 2.5vw;
696 
+    //             // &:hover{
697 
+    //             //     color:#48A038
698 
+    //             // }
684 699 
     //         }
685 700 
     //     }
686 
-    //     .news_paging{}
687 701 
     // }
688 
-    .main {
689 
-        width: 100%;
690 
-        padding-top: 14.5vw;
702 
+}
703 
+@media screen and (min-width: 1400px) and (max-width: 1600px) {
704 
+    .main{
691 705 
         .content{
692 
-            width: 92vw;
693 
-            margin: 0 auto;
694 
-            .news_title{
695 
-                display: block;
696 
-                margin-bottom: 12.5vw;
697 
-                padding-top: 50px;
698 
-                .title{
699 
-                    font-size: 32px;
700 
-                    text-align: center;
701 
-                }
702 
-                .title_screen{
703 
-                    margin-top: 10.625vw;
704 
-                    .screen_li{
705 
-                        width: 44.625vw;
706 
-                        height: 9.375vw;
707 
-                        font-size: 3.5vw;
708 
-                        .screen_box{
709 
-                            .screen_box_li{
710 
-                                font-size: 3.5vw;
711 
-                                height: 8vw;
712 
-                                line-height: 8vw;
713 
-                            }
714 
-                        }
715 
-                        svg{
716 
-                            width:5.5vw;
717 
-                            height: 4vw;
718 
-                        }
719 
-                    }
720 
-                }
721 
-            }
706 
+            width: calc(100% - 60px);
722 707 
             .banner_box{
723 
-                display: block;
724 
-                margin-bottom: 15vw;
725 708 
                 .news_banner{
726 
-                    width: 100%;
727 
-                    height: auto;
728 
-                    margin-bottom: 8vw;
729 
-
730 
-                    img{
731 
-                        width: 100%;
732 
-                        height: 62.75vw;
733 
-                        border-radius: 1.625vw;
734 
-                        object-fit: cover;
735 
-                    }
736 
-
709 
+                    width: 690px;
710 
+                    height: 455px;
737 711 
                     .news_content{
738 
-                        padding: 3.75vw;
739 
-                        display: flex;
740 
-                        flex-wrap: wrap;
741 
-                        flex-direction: column-reverse;
742 
-                        .cont1{
743 
-                            font-weight: bold;
744 
-                            font-size: 3.75vw;
745 
-                            color: #fff;
746 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
747 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
748 
-                            -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
749 
-                            overflow: hidden;            /* 隐藏超出部分 */
750 
-                            text-overflow: ellipsis;     /* 用省略号表示超出部分 */
751 
-                        }
752 
-                        .cont2{
753 
-                            width: 100%;
754 
-                            font-size: 3.375vw;
755 
-                            color: #fff;
756 
-                            margin-bottom: 2.5vw;
757 
-                        }
758 
-                        .cont3{
759 
-                            font-size: 3.25vw;
760 
-                            color: #fff;
761 
-                        }
712 
+                        border-radius: 12px;
762 713 
                     }
763 
-
764 
-                }
714 
+                }
765 715 
                 .news_banner2{
766 
-                    width: 100%;
767 
-                    display: flex;
768 
-                    align-items: center;
769 
-                    justify-content: space-between;
770 
-                    margin-bottom: 10.75vw;
716 
+                    width: 330px;
771 717 
                     img{
772 
-                        width: 45.375vw;
773 
-                        height: 34vw;
774 
-                        margin-bottom: 0;
775 
-                        border-radius: 1.625vw;
776 
-                    }
777 
-                    .banner2_cont{
778 
-                        width: 42.5vw;
718 
+                        height: 200px;
779 719 
                     }
780 720 
                     .txt1{
781 
-                        width: 42.5vw;
782 
-                        font-size: 3.75vw;
783 
-                        display: -webkit-box;           /* 使用 Flexbox 布局 */
784 
-                        -webkit-box-orient: vertical;   /* 垂直方向排列 */
785 
-                        -webkit-line-clamp: 2;         /* 限制显示的行数，这里是3行 */
786 
-                        overflow: hidden;               /* 隐藏超出部分 */
787 
-                        text-overflow: ellipsis;
788 
-                        line-height: 1.5;
789 
-                        padding-bottom: 0;
790 
-                        margin-bottom: 5.375vw;
791 
-                        border: 0;
721 
+                        font-size: 16px;
792 722 
                     }
793 723 
                     .txt2{
794 
-                        margin-bottom: 5.5vw;
795 
-                        font-size: 3.25vw;
796 
-                        color: #999999;
724 
+                        font-size: 14px;
797 725 
                     }
798 726 
                     .txt3{
799 
-                        display: none;
727 
+                        font-size: 14px;
800 728 
                     }
801 729 
                     a{
802 
-                        font-size: 3.325vw;
730 
+                        font-size: 14px;
803 731 
                         .icon{
804 
-                            font-size: 4.325vw;
805 
-                            margin-top: 0;
732 
+                            margin-top: -2px;
733 
+                            font-size: 18px;
806 734 
                         }
807 735 
                     }
808 736 
                 }
809 737 
             }
810 738 
             .tabs_box{
811 
-                width: 100%;
812 
-                font-size: 3.75vw;
813 
-                display: flex;
814 
-                align-items: center;
815 
-                justify-content: space-between;
816 
-                .tabs_li{
817 
-                    margin-right: 0;
818 
-                    padding-bottom: 5.625vw;
819 
-                }
739 
+                width: calc(100% - 60px);
820 740 
             }
821 741 
         }
822 
-        .news_ul{
742 
+        .news_ul {
743 
+            max-width: 100%;
744 
+            // width: calc(100% - 60px);
823 745 
             width: 100%;
746 
+            padding: 0 30px;
747 
+            overflow: hidden;
824 748 
             .news_list{
825 
-                margin-top: 0;
826 
-                width: 100%;
827 
-                box-sizing: border-box;
828 
-                padding: 0 3.75vw;
829 
-                .news_li{
830 
-                    padding:5.625vw 0;
831 
-                    display: flex;
832 
-                    align-items: center;
833 
-                    justify-content: space-between;
834 
-                    .li_left{
835 
-                        width: 16.25vw;
836 
-                        margin-right: 0;
837 
-                    }
838 
-                    .li_cont{
839 
-                        width: 71.5vw;
840 
-                        div:nth-child(1){
841 
-                            font-size: 3.75vw;
842 
-                            color: #282828;
843 
-                            line-height: 7.5vw;
844 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
845 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
846 
-                            -webkit-line-clamp: 1;      /* 限制显示的行数，这里是3行 */
847 
-                            overflow: hidden;
848 
-                            font-weight: bold;
849 
-                        }
850 
-                        div:nth-child(2){
851 
-                            width: auto;
852 
-                            height: auto;
853 
-                            overflow: unset;
854 
-                            line-height: 1.5;
855 
-                            font-size: 3.25vw;
856 
-                            color: #A7A5A5;
857 
-                            padding: 0;
858 
-                            display: -webkit-box;        /* 使用 Flexbox 布局 */
859 
-                            -webkit-box-orient: vertical; /* 垂直方向排列 */
860 
-                            -webkit-line-clamp: 2;      /* 限制显示的行数，这里是3行 */
861 
-                            overflow: hidden;
862 
-                        }
863 
-
864 
-                    }
865 
-                }
866 
-            }
867 
-        }
868 
-        .news_paging{
869 
-            padding-top: 16vw;
870 
-            .previousPage{
871 
-                width: 40px;
872 
-                height: 40px;
873 
-                margin-right: 20px;
874 
-                box-sizing: border-box;
875 
-            }
876 
-            .nextPage{
877 
-                width: 40px;
878 
-                height: 40px;
879 
-                margin-left: 3.25vw;
880 
-                transition: all 0.2s;
881 
-                box-sizing: border-box;
882 
-            }
883 
-            .pageNum{
884 
-                font-size: 3.5vw;
885 
-            }
886 
-            .ellipsis{
887 
-                font-size: 3.5vw;
888 
-                padding: 1.875vw 2.5vw;
889 
-                // &:hover{
890 
-                //     color:#48A038
891 
-                // }
749 
+                width: calc(100% - 60px);
892 750 
             }
893 751 
         }
752 
+        .news_paging{}
894 753 
     }
754 
+
895 755 
 }
896 756
897 757 
 //移动端样式

+ 2
- 2
src/pages/partyBuilding/index.html Dosyayı Görüntüle 

@@ -15,7 +15,7 @@
15 15 
 <body>
16 16 
     <%= require('../common/tpl/header.tpl') %>
17 17 
         <div class="main">
18 
-            <div class="content" id="p1">
18 
+            <div class="content" >
19 19 
                 <div class="news_title wow fadeInUp">党建工作</div>
20 20 
             </div>
21 21 
             <div class="wow domInUp banner">
 
@@ -38,7 +38,7 @@
38 38 
                   <div class="btn-next btn-nextB"><span class="icon iconfont icon-jiantou"></span></div>
39 39 
                 </div>
40 40 
             </div>
41 
-            <div class="content content2">
41 
+            <div class="content content2" id="p1">
42 42 
                 <div class="news_title">企业党建</div>
43 43 
             </div>
44 44 
             <div class="tabs_box">

+ 50
- 0
src/pages/socialResponsibility/App.js Dosyayı Görüntüle 

@@ -15,7 +15,57 @@ export default class App {
15 15 
         this.num = 0;
16 16 
         this.bindDom();
17 17 
         // this.fold()
18 
+        // 获取当前链接的 hash 部分
19 
+        // 监听 hashchange 事件
20 
+        window.addEventListener('hashchange', ()=>this.handleHashChange());
21 
+
22 
+        // 如果需要在页面加载时也获取一次当前 hash
23 
+        this.handleHashChange();
24 
+
25 
+    }
26 
+    // 定义一个函数来处理 hash 变化
27 
+    handleHashChange() {
28 
+        const hash = window.location.hash; // 获取当前链接的 hash 部分
29 
+        const params = hash.substring(1); // 去掉 #
30 
+        console.log(params); // 输出变化后的参数
31 
+        if(!params) return;
32 
+        if(this.getAnchorPoint) {
33 
+            this.getAnchorPoint(params)
34 
+        }else {
35 
+            getAnchorPoint(params)
36 
+        }
37 
+    }
38 
+
39 
+    getAnchorPoint(params){
40 
+        const tabs_ul = document.querySelectorAll(".tabs_li");
41 
+        const news_ul = document.querySelector(".news_ul");
42 
+        const typeCon = document.querySelector(".typeCon");
43 
+        tabs_ul.forEach((item,index)=>{
18 44
45 
+            tabs_ul.forEach((li) => {
46 
+                li.classList.remove('tabs_lis');
47 
+            });
48 
+            if(params == 'p2'){
49 
+                tabs_ul[1].classList.add('tabs_lis')
50 
+                news_ul.style.display = 'none';
51 
+                typeCon.style.display = 'block';
52 
+            }else{
53 
+                tabs_ul[0].classList.add('tabs_lis')
54 
+                news_ul.style.display = 'block';
55 
+                typeCon.style.display = 'none';
56 
+            }
57 
+            // 获取目标元素
58 
+            const targetElement = document.querySelector('#tab');
59 
+
60 
+            // 获取目标元素的位置信息
61 
+            if (targetElement) {
62 
+                const topPosition = targetElement.getBoundingClientRect().top + window.scrollY;
63 
+
64 
+                // 滚动到目标元素的位置
65 
+                window.scrollTo({ top: topPosition, behavior: 'smooth' });
66 
+            }
67 
+
68 
+        })
19 69 
     }
20 70
21 71 
     bindDom(){

+ 2
- 2
src/pages/socialResponsibility/index.html Dosyayı Görüntüle 

@@ -31,8 +31,8 @@
31 31 
           </div>
32 32 
         </div>
33 33 
         <div class="tabs_box" id="tab">
34 
-          <div class="tabs_li tabs_lis">社会公益</div>
35 
-          <div class="tabs_li">绿色转型</div>
34 
+          <div class="tabs_li tabs_lis" data-id="p1">社会公益</div>
35 
+          <div class="tabs_li" data-id="p2">绿色转型</div>
36 36 
         </div>
37 37 
       </div>
38 38 
       <div class="news_ul">

+ 1
- 1
src/pages/socialResponsibility/index.less Dosyayı Görüntüle 

@@ -72,7 +72,7 @@
72 72 
                 color: #231F20;
73 73 
                 margin-right: 80px;
74 74 
                 cursor: pointer;
75 
-                padding-bottom: 30px;
75 
+                padding: 30px 0;
76 76 
                 transition: all .2s;
77 77 
                 border-bottom: 2px solid transparent;
78 78 
                 position: relative;

Write Preview
Loading…
İptal
Kaydet