Skip to content

任超 / js.portalStaticPage

Go to a project
Toggle navigation
Toggle navigation pinning
80ce80b5 by 焦小希
Options

公告列表页面的更改

1 parent d79aaeee
Inline Side-by-side
Showing 3 changed files with 656 additions and 0 deletions
1 * {
2 margin: 0;
3 padding: 0;
4 }
5
6 ::-webkit-input-placeholder { /* WebKit browsers */
7 font-size: 13px;
8 color: #9B9B9B;
9 }
10
11 ::-moz-placeholder { /* Mozilla Firefox 19+ */
12 font-size: 13px;
13 color: #9B9B9B;
14 }
15
16 :-ms-input-placeholder { /* Internet Explorer 10+ */
17 font-size: 13px;
18 color: #9B9B9B;
19 }
20 input {
21 padding-left: 10px;
22 }
23 /*================首页 start=====================*/
24 div a {
25 color: #000000;
26 text-decoration: none;
27 }
28
29 div.subject h2 a:hover {
30 color: #f46143;
31 }
32
33 div.subject {
34 margin: 0 auto;
35 float: none;
36 clear: both;
37 position: relative;
38 }
39
40 /*新闻 */
41 div.top-logo {
42 width: 1200px;
43 height: 70px;
44 padding-top: 20px;
45 }
46
47 div.top-logo ::-webkit-input-placeholder { /* WebKit browsers */
48 font-size: 13px;
49 }
50
51 div.top-logo ::-moz-placeholder { /* Mozilla Firefox 19+ */
52 font-size: 13px;
53 }
54
55 div.top-logo :-ms-input-placeholder { /* Internet Explorer 10+ */
56 font-size: 13px;
57 }
58
59 .top_logo_content {
60 height: 40px;
61 width: 100%;
62 margin: 0 auto;
63 }
64
65 div.top-logo .top_logo_search {
66 float: left;
67 width: 350px;
68 position: relative;
69 margin-left: 400px;
70 }
71
72 div.top-logo .top_logo_search input {
73 border-radius: 50px;
74 }
75
76 div.top-logo .login {
77 float: right;
78 margin-top: 8px;
79 }
80
81 div.top-logo .top_logo_search i {
82 position: absolute;
83 right: 10px;
84 top: 11px;
85 cursor: pointer;
86 }
87 /*------------------首页 end------------*/
88
89 .top-logo ul li {
90 display: inline-block;
91 padding: 0 8px;
92 }
93
94 .top-logo ul li:first-child {
95 border-right: 1px solid grey;
96 }
97
98 div.navigation {
99 text-align: center;
100 }
101
102 .navigation .layui-nav-item {
103 width: 147px;
104 position: relative;
105 }
106 .layui-bg-blue {
107 background-color: #006CFF !important;
108 }
109 .layui-nav-item a{
110 font-size: 16px;
111 }
112
113 /*------------------首页 end------------*/
114 /* --------------------导航tab------------------------- */
115 .navigation_crumbs {
116 width: 100%;
117 height: 50px;
118 padding: 10px 0;
119 line-height: 25px;
120 background: #FAFAFA;
121 border: 1px solid #E6E6E6;
122 /* box-sizing: border-box; */
123 }
124 .navigation_crumbs .layui-breadcrumb a:hover {
125 color: #f46143!important;
126 }
127
128 .contentBox {
129 width: 1200px;
130 margin: 0 auto;
131 overflow: hidden;
132 }
133 .layui-tab-brief>.layui-tab-title .layui-this{
134 color: #4A4A4A !important;
135 font-size: 18px;
136 font-weight: 500;
137 }
138 .layui-tab-brief>.layui-tab-title .layui-this:after{
139 border-bottom: 2px solid #006CFF !important
140 }
141 .one_content {
142 border: 1px solid #DEDEDE;;
143 margin-top: 30px;
144 }
145 .one_content .layui-tab {
146 margin: 0;
147 }
148 .one_content .layui-tab-title li {
149 width: 100px;
150 font-weight: 600;
151 color: #6D7278;
152 }
153 .one_content .layui-tab-title .layui-this {
154 color: #4A4A4A;
155 }
156 .layui-tab-brief>.layui-tab-more li.layui-this:after, .layui-tab-brief>.layui-tab-title .layui-this:after {
157 border-color: #006CFF;
158 }
159 .layui-tab .layui-tab-brief .layui-this {
160 color: #006CFF;
161 }
162 .layui-tab .layui-tab-brief li {
163 width: 90px;
164 }
165 .online_business {
166 margin-top: 20px;
167 }
168 .online_business h2 {
169 width: 100%;
170 height: 43px;
171 line-height: 43px;
172 background: #FAFAFA;
173 border-radius: 4px;
174 border: 1px solid #DEDEDE;
175 padding-left: 15px;
176 box-sizing: border-box;
177 }
178 .online_list {
179 padding-bottom: 20px;
180 overflow: hidden;
181 }
182 .online_list li{
183 width: 45%!important;
184 float: left;
185 height: 60px;
186 line-height: 60px;
187 border-bottom: 1px dotted #DEDEDE;
188 }
189 .online_list li:nth-child(even) {
190 margin-left: 10%;
191 }
192 .online_list li a{
193 display: block;
194 width: 100%;
195 }
196 .online_list li a:hover span{
197 color: #f46143;
198 }
199 .online_list li a button {
200 float: right;
201 margin-top: 15px;
202 }
203 /* ---------------------------------------------------- */
204 .mainbody {
205 width: 1200px;
206 margin: 0 auto;
207 /* min-height:calc(100vh - 200px); */
208 /* overflow: hidden; */
209 }
210 .listArea{
211 min-height: calc(100vh - 200px);
212 }
213 .top {
214 text-align: center;
215 height: 106px;
216 font-size: 14px;
217 font-weight: bold;
218 color: #4A4A4A;
219 border-bottom: 1px solid #DEDEDE;
220 display: flex;
221 align-items: center;
222 }
223
224 .top > div {
225 margin: 0 auto;
226 display: inline-block;
227 }
228 .top span{
229 display:inline-block;
230 width: 60px;
231 height: 14px;
232 font-size: 14px;
233 font-weight: 500;
234 color: #4A4A4A;
235 line-height: 14px;
236 }
237 .top input {
238 width: 360px;
239 height: 36px;
240 background: #FFFFFF;
241 border-radius: 2px;
242 border: 1px solid #CBCBCB;
243 margin-left: 10px;
244 }
245
246 .top button {
247 width: 120px;
248 height: 40px;
249 background: #0091FF;
250 border: none;
251 border-radius: 3px;
252 color: white;
253 }
254 .gglist{
255 width:76%;
256 float: left;
257 /* background: red; */
258 }
259 .gglist li{
260 height: 104px;
261 }
262 .gglist li{
263 border-bottom:1px solid #EAEAEA;
264 border-right:1px solid #EAEAEA
265 }
266 .rightcontainer{
267 float:right;
268 width: 23%
269 }
270 .diver{
271 float:right;
272 width: 23%;
273 width: 195px;
274 height: 1px;
275 background: #DEDEDE;
276 margin:0 auto;
277 margin-bottom:40px;
278 margin-top: 40px;
279 margin-right: 77px;
280 }
281 .zc-top{
282 width: 72px;
283 height: 18px;
284 font-size: 18px;
285 font-weight: 500;
286 color: #4A4A4A;
287 line-height: 18px;
288 }
289 /* .top-date input:before {
290 content: attr(placeholder)
291 } */
292
293 .filter {
294 display: flex;
295 justify-content: left;
296 }
297
298 .filter div {
299 display: inline-block;
300 padding: 20px;
301 background: #FFFFFF;
302 width: 102px;
303 font-size: 16px;
304 font-weight: 500;
305 color: #6D7278;
306 line-height: 20px;
307 }
308
309 .filter div:first-child {
310 width: 102px;
311 height: 20px;
312 font-size: 18px;
313 font-weight: bold;
314 color: #4A4A4A;
315 line-height: 20px;
316 }
317
318 .body {
319 display: flex;
320 justify-items: left;
321 }
322
323 .body div {
324 display: inline-block;
325 }
326
327 .left {
328 border-right-style: inset;
329 border-right: 1px solid #DEDEDE;
330 }
331
332 .right {
333 width: 400px;
334 }
335
336 .left, .right {
337 float: left;
338 }
339
340 .gg-tag {
341 background-color: #FA6800;
342 width: 40px;
343 height: 15px;
344 font-size: 10px;
345 font-weight: 500;
346 color: #FFFFFF;
347 line-height: 15px;
348 padding-left: 8px;
349 }
350
351 .gg {
352 text-overflow: clip;
353 overflow: hidden;
354 height: 100px;
355 font-size: 20px;
356 font-weight: bold;
357 color: #4A4A4A;
358 line-height: 104px;
359 padding-left: 20px;
360 padding-right: 20px;
361 }
362
363 .right {
364 width: 200px;
365 margin-left: 15px;
366 }
367
368 .right-top {
369 width: 72px;
370 height: 18px;
371 font-size: 18px;
372 font-weight: 500;
373 color: #4A4A4A;
374 line-height: 18px;
375 margin-bottom: 19px;
376 margin-top:30px
377 }
378 .right-body {
379 display: inline-block;
380 margin-bottom: 20px;
381 }
382
383 .tj img {
384 width: 200px;
385 height: 125px;
386 }
387
388 .tj img, .tj span {
389 float: left;
390 }
391
392 .tj-title {
393 width: 203px;
394 font-size: 14px;
395 font-family: PingFangSC-Medium, PingFang SC;
396 font-weight: bold;
397 color: #4A4A4A;
398 line-height: 21px;
399 display: inline-block;
400 margin-top: 9px
401 }
402
403 .tj-date {
404 width: 90px;
405 height: 12px;
406 font-size: 12px;
407 font-family: PingFangSC-Regular, PingFang SC;
408 font-weight: 400;
409 color: #9B9B9B;
410 line-height: 12px;
411 display: inline-block;
412 margin-top: 6px;
413 }
414
415 .right-bottom {
416 border-top-style: inset;
417 border-top: 1px solid #DEDEDE;
418 }
419
420 .right-bottom-top {
421 width: 108px;
422 height: 18px;
423 font-size: 18px;
424 margin-top: 20px;
425 font-family: PingFangSC-Medium, PingFang SC;
426 font-weight: bold;
427 color: #4A4A4A;
428 line-height: 18px;
429 }
430
431 .zcfg {
432 margin-top: 20px;
433 display: inline-block;
434 }
435
436 .zcfg div {
437 float: left;
438 }
439
440 .zcfg-top {
441 width: 200px;
442 height: 14px;
443 font-size: 14px;
444 font-family: PingFangSC-Medium, PingFang SC;
445 font-weight: bold;
446 color: #4A4A4A;
447 line-height: 14px;
448 }
449
450 .zcfg-body {
451 width: 200px;
452 font-size: 14px;
453 display: inline-block;
454 font-family: PingFangSC-Regular, PingFang SC;
455 font-weight: 400;
456 color: #6D7278;
457 line-height: 21px;
458 }
459
460 .zcfg-bottom {
461 width: 90px;
462 height: 12px;
463 font-size: 12px;
464 font-family: PingFangSC-Regular, PingFang SC;
465 font-weight: 400;
466 color: #9B9B9B;
467 line-height: 12px;
468 }
...\ No newline at end of file ...\ No newline at end of file
1 layui.use('element', function () {
2 var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
3 //监听导航点击
4 element.on('nav(demo)', function (elem) {
5 //console.log(elem)
6 layer.msg(elem.text());
7 });
8 });
...\ No newline at end of file ...\ No newline at end of file
1 <!DOCTYPE html
2 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3 <html xmlns="http://www.w3.org/1999/xhtml">
4 <head>
5 <style>
6 </style>
7 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
8 <title>公示公告</title>
9 <script type="text/javascript" src="../staticJs/head.js"></script>
10 <link rel="stylesheet" type="text/css" href="../staticCss/gsgg.css">
11 </head>
12 <body>
13 <div class="navigation_crumbs">
14 <div class="contentBox">
15 <span class="layui-breadcrumb">
16 <a href="../index.html">首页</a>
17 <a><cite>公示公告</cite></a>
18 </span>
19 </div>
20 </div>
21 <div class="mainbody">
22 <div class="top">
23 <div class="top-title">
24 <span>标题内容:</span><input type="text" placeholder="请输入标题内容">
25 </div>
26 <div class="top-date ">
27 <span>发布时间:</span><input type="date" placeholder="选择时间">
28 </div>
29 <div class="top-serach">
30 <button>查询</button>
31 </div>
32 </div>
33 <div class="layui-tab layui-tab-brief" lay-filter="">
34 <ul class="layui-tab-title">
35 <li class="layui-this">全部</li>
36 <li>公示</li>
37 <li>公告</li>
38 </ul>
39 </div>
40 <!-- 列表区域 -->
41 <div class="listArea">
42 <div>
43 <ul class="gglist">
44 <li>
45 <a href="./ggxq.html" target="_blank">
46 <div class="gg">
47 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
48 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
49 </div>
50 </a>
51 </li>
52 <li>
53 <a href="./ggxq.html" target="_blank">
54 <div class="gg">
55 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
56 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
57 </div>
58 </a>
59 </li>
60 <li>
61 <a href="./ggxq.html" target="_blank">
62 <div class="gg">
63 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
64 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量
65 </div>
66 </a>
67 </li>
68 <li>
69 <a href="./ggxq.html" target="_blank">
70 <div class="gg">
71 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
72 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
73 </div>
74 </a>
75 </li>
76 <li>
77 <a href="./ggxq.html" target="_blank">
78 <div class="gg">
79 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
80 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
81 </div>
82 </a>
83 </li>
84 <li>
85 <a href="./ggxq.html" target="_blank">
86 <div class="gg">
87 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
88 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
89 </div>
90 </a>
91 </li>
92 <li>
93 <a href="./ggxq.html" target="_blank">
94 <div class="gg">
95 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
96 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
97 </div>
98 </a>
99 </li>
100 <li>
101 <a href="./ggxq.html" target="_blank">
102 <div class="gg">
103 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
104 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
105 </div>
106 </a>
107 </li>
108 <li>
109 <a href="./ggxq.html" target="_blank">
110 <div class="gg">
111 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
112 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
113 </div>
114 </a>
115 </li>
116 <li>
117 <a href="./ggxq.html" target="_blank">
118 <div class="gg">
119 <button type="button" class="layui-btn layui-btn-warm layui-btn-xs">公告</button>
120 党的十八大以来双拥工作综述：为实现中国梦强军梦凝聚强大力量 前三季度主要指标由负转正
121 </div>
122 </a>
123 </li>
124 </ul>
125 </div>
126 <div>
127 <ul class="rightcontainer">
128 <h2 class="right-top">新闻推荐</h2>
129 <li class="tj">
130 <img src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg">
131 <span class="tj-title"> 爬山虎国土空间信息化解决方案</span>
132 <span class="tj-date">2020-12-12</span>
133 </li>
134 <li class="tj" >
135 <img src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg">
136 <span class="tj-title"> 爬山虎国土空间信息化解决方案</span>
137 <span class="tj-date">2020-12-12</span>
138 </li>
139 </ul>
140 <ul class="diver">
141 <li></li>
142 </ul>
143 <ul class="rightcontainer">
144 <h2 class="zc-top">政策法规</h2>
145 <li>
146 <div class="zcfg">
147 <div class="zcfg-top">
148 <span>爬山虎国土空间规划信息化解决</span>
149 </div>
150 <div class="zcfg-body">
151 <span>10月21日，农业农村部举行新闻发布会，介绍2020年前三季度农业农村经济形势。</span>
152 </div>
153 <div class="zcfg-bottom">
154 <span>2020-10-28</span>
155 </div>
156 </div>
157 </li>
158 <li>
159 <div class="zcfg">
160 <div class="zcfg-top">
161 <span>爬山虎国土空间规划信息化解决</span>
162 </div>
163 <div class="zcfg-body">
164 <span>10月21日，农业农村部举行新闻发布会，介绍2020年前三季度农业农村经济形势。</span>
165 </div>
166 <div class="zcfg-bottom">
167 <span>2020-10-28</span>
168 </div>
169 </div>
170 </li>
171 </ul>
172 </div>
173 </div>
174 </div>
175 </div>
176 </body>
177 <script type="text/javascript" src="../staticJs/common.js"></script>
178 <script type="text/javascript" src="../staticJs/down.js"></script>
179 <script type="text/javascript" src="../staticJs/gsgg.js"></script>
180 </html>
...\ No newline at end of file ...\ No newline at end of file