feat():绘制新闻详情页
Showing
3 changed files
with
472 additions
and
2 deletions
... | @@ -10,6 +10,7 @@ | ... | @@ -10,6 +10,7 @@ |
10 | 10 | ||
11 | .left { | 11 | .left { |
12 | border-right-style: inset; | 12 | border-right-style: inset; |
13 | border-right: 1px solid #DEDEDE; | ||
13 | } | 14 | } |
14 | 15 | ||
15 | .right { | 16 | .right { |
... | @@ -24,6 +25,7 @@ | ... | @@ -24,6 +25,7 @@ |
24 | padding-top: 10px; | 25 | padding-top: 10px; |
25 | height: 150px; | 26 | height: 150px; |
26 | border-bottom-style: inset; | 27 | border-bottom-style: inset; |
28 | border-bottom: 1px solid #DEDEDE; | ||
27 | } | 29 | } |
28 | 30 | ||
29 | .xw-left img { | 31 | .xw-left img { |
... | @@ -89,7 +91,6 @@ | ... | @@ -89,7 +91,6 @@ |
89 | .right-body { | 91 | .right-body { |
90 | display: inline-block; | 92 | display: inline-block; |
91 | margin-bottom: 20px; | 93 | margin-bottom: 20px; |
92 | /*border-bottom-style: inset;*/ | ||
93 | } | 94 | } |
94 | 95 | ||
95 | .tj { | 96 | .tj { |
... | @@ -127,7 +128,7 @@ | ... | @@ -127,7 +128,7 @@ |
127 | 128 | ||
128 | .right-bottom { | 129 | .right-bottom { |
129 | border-top-style: inset; | 130 | border-top-style: inset; |
130 | border-top-color: #DEDEDE; | 131 | border-top: 1px solid #DEDEDE; |
131 | } | 132 | } |
132 | 133 | ||
133 | .right-bottom-top { | 134 | .right-bottom-top { | ... | ... |
views/xwxq/css/index.css
0 → 100644
1 | * { | ||
2 | padding: 0; | ||
3 | margin: 0; | ||
4 | } | ||
5 | |||
6 | .main { | ||
7 | margin-left: 250px; | ||
8 | } | ||
9 | |||
10 | .title { | ||
11 | height: 30px; | ||
12 | font-size: 30px; | ||
13 | padding-top: 45px; | ||
14 | padding-bottom: 70px; | ||
15 | font-family: PingFangSC-Medium, PingFang SC; | ||
16 | font-weight: 500; | ||
17 | color: #4A4A4A; | ||
18 | line-height: 30px; | ||
19 | |||
20 | } | ||
21 | |||
22 | .left { | ||
23 | border-right: 1px solid #DEDEDE; | ||
24 | display: inline-block; | ||
25 | } | ||
26 | |||
27 | .title { | ||
28 | text-align: center; | ||
29 | } | ||
30 | |||
31 | .left-left, .left-right { | ||
32 | float: left; | ||
33 | border-top: 1px solid #DEDEDE; | ||
34 | } | ||
35 | |||
36 | .left-left { | ||
37 | border-right: 1px solid #DEDEDE; | ||
38 | text-align: center; | ||
39 | display: inline-block; | ||
40 | margin: 0 auto; | ||
41 | width: 80px; | ||
42 | } | ||
43 | |||
44 | |||
45 | .readNum { | ||
46 | margin-top: 50px; | ||
47 | } | ||
48 | |||
49 | /*.readNum div { | ||
50 | width: 36px; | ||
51 | margin: 0 auto; | ||
52 | }*/ | ||
53 | |||
54 | .readNum div:nth-child(1) { | ||
55 | height: 12px; | ||
56 | font-size: 12px; | ||
57 | font-family: PingFangSC-Regular, PingFang SC; | ||
58 | font-weight: 400; | ||
59 | color: #6D7278; | ||
60 | line-height: 12px; | ||
61 | } | ||
62 | |||
63 | .readNum div:nth-child(2) { | ||
64 | height: 16px; | ||
65 | font-size: 16px; | ||
66 | font-family: PingFangSC-Medium, PingFang SC; | ||
67 | font-weight: 500; | ||
68 | color: #4A4A4A; | ||
69 | line-height: 16px; | ||
70 | } | ||
71 | |||
72 | .date, .readNum, .share, .comment { | ||
73 | margin-top: 30px; | ||
74 | } | ||
75 | |||
76 | .date div:nth-child(1), .date div:nth-child(3) { | ||
77 | width: 39px; | ||
78 | height: 16px; | ||
79 | font-size: 16px; | ||
80 | font-family: PingFangSC-Regular, PingFang SC; | ||
81 | font-weight: 400; | ||
82 | color: #4A4A4A; | ||
83 | line-height: 16px; | ||
84 | margin: 0 auto; | ||
85 | } | ||
86 | |||
87 | .date div:nth-child(2) { | ||
88 | width: 61px; | ||
89 | height: 24px; | ||
90 | font-size: 24px; | ||
91 | font-family: PingFangSC-Medium, PingFang SC; | ||
92 | font-weight: 500; | ||
93 | color: #4A4A4A; | ||
94 | line-height: 24px; | ||
95 | } | ||
96 | |||
97 | .left-right { | ||
98 | width: 880px; | ||
99 | } | ||
100 | |||
101 | .body { | ||
102 | margin: 20px; | ||
103 | } | ||
104 | |||
105 | .Mycomment { | ||
106 | border-top: 1px solid #DEDEDE; | ||
107 | height: 80px; | ||
108 | } | ||
109 | |||
110 | .commentTitle { | ||
111 | width: 40px; | ||
112 | height: 20px; | ||
113 | font-size: 20px; | ||
114 | font-family: PingFangSC-Medium, PingFang SC; | ||
115 | font-weight: bold; | ||
116 | color: #4A4A4A; | ||
117 | line-height: 20px; | ||
118 | margin-left: 20px; | ||
119 | margin-top: 20px; | ||
120 | } | ||
121 | |||
122 | .commentInput { | ||
123 | height: 80px; | ||
124 | } | ||
125 | |||
126 | .comment-bottom div { | ||
127 | float: left; | ||
128 | margin-left: 20px; | ||
129 | } | ||
130 | |||
131 | .comment-bottom div:nth-child(1) { | ||
132 | width: 240px; | ||
133 | height: 12px; | ||
134 | font-size: 12px; | ||
135 | font-family: PingFangSC-Regular, PingFang SC; | ||
136 | margin-top: 20px; | ||
137 | font-weight: 400; | ||
138 | color: #9B9B9B; | ||
139 | line-height: 12px; | ||
140 | } | ||
141 | |||
142 | .comment-bottom div:nth-child(2) { | ||
143 | margin-top: 20px; | ||
144 | height: 14px; | ||
145 | font-size: 14px; | ||
146 | font-family: PingFangSC-Regular, PingFang SC; | ||
147 | font-weight: 400; | ||
148 | color: #006CFF; | ||
149 | line-height: 14px; | ||
150 | } | ||
151 | |||
152 | .comment-bottom-num { | ||
153 | float: right !important; | ||
154 | margin-right: 20px; | ||
155 | } | ||
156 | |||
157 | .commentInput { | ||
158 | margin-top: 20px; | ||
159 | height: auto; | ||
160 | } | ||
161 | |||
162 | .commentInput img { | ||
163 | width: 40px; | ||
164 | height: 40px; | ||
165 | border-radius: 50%; | ||
166 | overflow: hidden | ||
167 | } | ||
168 | .commentInputImg{ | ||
169 | height: 100px; | ||
170 | } | ||
171 | .commentInputImg, commentInputInput { | ||
172 | float: left; | ||
173 | } | ||
174 | |||
175 | .commentInput input { | ||
176 | width: 800px; | ||
177 | height: 130px; | ||
178 | background: #FFFFFF; | ||
179 | border: 1px solid #DEDEDE; | ||
180 | margin-left: 20px; | ||
181 | } | ||
182 | |||
183 | .commentInput button { | ||
184 | width: 120px; | ||
185 | height: 42px; | ||
186 | background: #0091FF; | ||
187 | border-radius: 3px; | ||
188 | margin-left: 58px; | ||
189 | margin-top: 20px; | ||
190 | } | ||
191 | |||
192 | .CommentdetailsTitle { | ||
193 | height: 80px; | ||
194 | } | ||
195 | |||
196 | .right { | ||
197 | width: 400px; | ||
198 | } | ||
199 | |||
200 | .left, .right { | ||
201 | float: left; | ||
202 | } | ||
203 | |||
204 | .right { | ||
205 | width: 200px; | ||
206 | margin-left: 15px; | ||
207 | } | ||
208 | |||
209 | .right-top { | ||
210 | width: 100px; | ||
211 | height: 18px; | ||
212 | font-size: 18px; | ||
213 | font-family: PingFangSC-Medium, PingFang SC; | ||
214 | font-weight: 500; | ||
215 | color: #4A4A4A; | ||
216 | line-height: 18px; | ||
217 | } | ||
218 | |||
219 | .right-body { | ||
220 | display: inline-block; | ||
221 | margin-bottom: 20px; | ||
222 | } | ||
223 | |||
224 | .tj { | ||
225 | /*margin-bottom: 10px;*/ | ||
226 | } | ||
227 | |||
228 | .tj img { | ||
229 | width: 200px; | ||
230 | height: 125px; | ||
231 | margin-top: 20px; | ||
232 | } | ||
233 | |||
234 | .tj img, .tj span { | ||
235 | float: left; | ||
236 | } | ||
237 | |||
238 | .tj-title { | ||
239 | width: 203px; | ||
240 | font-size: 14px; | ||
241 | font-family: PingFangSC-Medium, PingFang SC; | ||
242 | font-weight: bold; | ||
243 | color: #4A4A4A; | ||
244 | line-height: 21px; | ||
245 | } | ||
246 | |||
247 | .tj-date { | ||
248 | width: 90px; | ||
249 | height: 12px; | ||
250 | font-size: 12px; | ||
251 | font-family: PingFangSC-Regular, PingFang SC; | ||
252 | font-weight: 400; | ||
253 | color: #9B9B9B; | ||
254 | line-height: 12px; | ||
255 | } | ||
256 | |||
257 | .right-bottom { | ||
258 | border-top-style: inset; | ||
259 | border-top: 1px solid #DEDEDE; | ||
260 | } | ||
261 | |||
262 | .right-bottom-top { | ||
263 | width: 108px; | ||
264 | height: 18px; | ||
265 | font-size: 18px; | ||
266 | margin-top: 20px; | ||
267 | font-family: PingFangSC-Medium, PingFang SC; | ||
268 | font-weight: bold; | ||
269 | color: #4A4A4A; | ||
270 | line-height: 18px; | ||
271 | } | ||
272 | |||
273 | .zcfg { | ||
274 | margin-top: 20px; | ||
275 | display: inline-block; | ||
276 | } | ||
277 | |||
278 | .zcfg div { | ||
279 | float: left; | ||
280 | } | ||
281 | |||
282 | .zcfg-top { | ||
283 | width: 200px; | ||
284 | height: 14px; | ||
285 | font-size: 14px; | ||
286 | font-family: PingFangSC-Medium, PingFang SC; | ||
287 | font-weight: bold; | ||
288 | color: #4A4A4A; | ||
289 | line-height: 14px; | ||
290 | } | ||
291 | |||
292 | .zcfg-body { | ||
293 | width: 200px; | ||
294 | font-size: 14px; | ||
295 | display: inline-block; | ||
296 | font-family: PingFangSC-Regular, PingFang SC; | ||
297 | font-weight: 400; | ||
298 | color: #6D7278; | ||
299 | line-height: 21px; | ||
300 | } | ||
301 | |||
302 | .zcfg-bottom { | ||
303 | width: 90px; | ||
304 | height: 12px; | ||
305 | font-size: 12px; | ||
306 | font-family: PingFangSC-Regular, PingFang SC; | ||
307 | font-weight: 400; | ||
308 | color: #9B9B9B; | ||
309 | line-height: 12px; | ||
310 | } | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
views/xwxq/index.html
0 → 100644
1 | <!DOCTYPE html> | ||
2 | <html lang="en"> | ||
3 | <head> | ||
4 | <meta charset="UTF-8"> | ||
5 | <title>新闻详情</title> | ||
6 | <meta charset="UTF-8"> | ||
7 | <meta http-equiv="X-UA-Compatible" content="IE=edge"/> | ||
8 | <meta name="format-detection" content="telephone=no"> | ||
9 | <meta name="renderer" content="webkit"> | ||
10 | <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"> | ||
11 | <meta http-equiv="Cache-Control" content="no-siteapp"/> | ||
12 | <link rel="stylesheet" type="text/css" href="../../lib/layui/css/layui.css"/> | ||
13 | <link rel="alternate icon" type="image/png" href="../../images/logo-realestate.png"> | ||
14 | <link rel='icon' href='../../favicon.ico' type='image/x-ico'/> | ||
15 | <meta name="description" content=""/> | ||
16 | <meta name="keywords" content=""/> | ||
17 | <link rel="stylesheet" href="../../css/default.min.css?t=227"/> | ||
18 | <link rel="stylesheet" type="text/css" href="css/index.css"> | ||
19 | </head> | ||
20 | <body> | ||
21 | <div class="main"> | ||
22 | <div class="left"> | ||
23 | <div class="title"> | ||
24 | <div> | ||
25 | <span>党的十八大以来双拥工作综述:为实现中国梦强军梦凝聚强大力量</span> | ||
26 | </div> | ||
27 | </div> | ||
28 | <div class="left-left"> | ||
29 | <div class="date"> | ||
30 | <div>2020</div> | ||
31 | <div>10/27</div> | ||
32 | <div>20:53</div> | ||
33 | </div> | ||
34 | <div class="readNum"> | ||
35 | <div> | ||
36 | <span>阅读量</span> | ||
37 | </div> | ||
38 | <div> | ||
39 | <span>1132</span> | ||
40 | </div> | ||
41 | </div> | ||
42 | <div class="share"> | ||
43 | <div>-分享-</div> | ||
44 | <div>微信</div> | ||
45 | <div>朋友圈</div> | ||
46 | <div>微博</div> | ||
47 | <div>qq</div> | ||
48 | <div>qq空间</div> | ||
49 | </div> | ||
50 | <div class="comment"> | ||
51 | <div> | ||
52 | <span>--评论--</span> | ||
53 | </div> | ||
54 | <div>评论图标</div> | ||
55 | </div> | ||
56 | </div> | ||
57 | <div class="left-right"> | ||
58 | <div class="body"> | ||
59 | <span> | ||
60 | 近日,自然资源部印发《自然资源统计工作管理办法》,旨在规范自然资源统计管理工作,建立健全统计数据质量控制体系,提高自然资源统计数据的真实性,发挥统计在自然资源管理中的重要基础性作用,该办法将于2020年8月1日起施行。 《自然资源统计工作管理办法》 一、明确自然资源统计主要任务 对7大类自然资源对象(土地、矿产、森林、草原、湿地、水、海域海岛),以及其他统计对象(海洋经济、地质勘查、地质灾害、测绘地理信息、自然资源督察、行政管理)开展统计调查和统计分析,提供统计数据,实施统计监督。 二、明晰自然资源统计数据获取方式 自然资源统计数据获取方式主要有:资源调查、行政记录、联网直报、逐级上报。并定期公布统计数据,在政策制定、规划编制、监督考核时,需要使用数据的,以公布的统计数据为准。 三、健全自然资源统计数据的质控体系 加强源头控制,填报人对其填报、录入的原始数据的真实性、准确性负责。严格审核,各单位对其负责加工整理、汇总生成的数据进行严格审核,对数据质量负责;发现数据异常的,应当返回填报人核实修改。审核结果和修改情况记录留痕。 完善统计流程,建立健全数据审核、签署、交接、归档等管理制度,建立违规干预统计工作记录制度和统计信用制度。加强技术校核,充分利用各种技术手段对数据进行校核,开展逻辑检验、数据抽查、实地核查,综合评估、控制和提升数据质量。 | ||
61 | 四、加强自然资源统计信息化建设 加强自然资源统计信息化建设,实现统计数据全流程信息化生产和管理。建立健全统一的自然资源统计数据平台,推进统计数据平台与业务信息系统的互联互通、数据交互共享。完善统计网络直报系统。 五、更新制度和办法保证统计工作推进 在2019年07月,自然资源部办公厅已经颁发了《关于印发自然资源统计调查制度的通知》,制定“1+8”的“综合+专业”统计调查制度体系。《自然资源统计工作管理办法》出台将会进一步支持各项自然资源统计调查执行工作。办法自2020年8月1日起施行,原国土资源部公布的《国土资源统计工作管理办法》、原国家海洋局公布的《国家海洋局综合统计暂行规定》、原国家测绘地理信息局公布的《测绘统计管理办法》同时废止。 《办法》中明确指出,自然资源部统计归口管理机构组织开展全国自然资源综合统计工作,推进信息化建设,信息化的建设离不开对数据的运筹帷幄。北京数慧结合自身多年对数据处理的“精湛工艺”,对自然资源业务的深度理解和丰富经验,开发自然资源统计业务信息系统,设计建立部自然资源统计数据库,实现历史统计数据的迁移、分析、转换,完成历史统计数据融合与应用,为自然资源部本级统计工作提供适应当前统计业务管理的统一工作平台,有效支撑统计数据报送审核、整合汇总、数据管理、报表生成、统计报告编制、数据综合分析、数据展示和空间分析、信息服务等全流程运转模式,实现统计信息审核机制,提升自然资源统计的数据业务管理能力、综合分析能力和决策支撑能力。 | ||
62 | </span> | ||
63 | </div> | ||
64 | <div class="Mycomment"> | ||
65 | <div class="commentTitle"><span>评论</span></div> | ||
66 | <div class="comment-bottom"> | ||
67 | <div><span>文明上网理性发言,请遵守新闻评论服务协议</span></div> | ||
68 | <div class="comment-bottom-num"><span>110条评论</span></div> | ||
69 | </div> | ||
70 | </div> | ||
71 | <div class="commentInput"> | ||
72 | <div class="commentInputImg"> | ||
73 | <img src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg"> | ||
74 | </div> | ||
75 | <div class="commentInputInput"> | ||
76 | <input type="text"> | ||
77 | </div> | ||
78 | <div> | ||
79 | <button class="layui-btn layui-btn-lg layui-btn-norma">发表</button> | ||
80 | </div> | ||
81 | </div> | ||
82 | <div class="Commentdetails"> | ||
83 | <div class="CommentdetailsTitle"> | ||
84 | <span> | ||
85 | 全部评论 | ||
86 | </span> | ||
87 | <span>/</span> | ||
88 | <span> | ||
89 | 我的评论 | ||
90 | </span></div> | ||
91 | </div> | ||
92 | </div> | ||
93 | </div> | ||
94 | <div class="right"> | ||
95 | <div class="right-top"> | ||
96 | <h2>新闻推荐</h2> | ||
97 | </div> | ||
98 | <div class="right-body"> | ||
99 | <div class="tj"> | ||
100 | <img | ||
101 | src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg"> | ||
102 | <span class="tj-title"> | ||
103 | 爬山虎国土空间信息化解决方案 | ||
104 | </span> | ||
105 | <span class="tj-date"> | ||
106 | 2020-12-12 | ||
107 | </span> | ||
108 | </div> | ||
109 | <div class="tj"> | ||
110 | <img | ||
111 | src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1938529415,777611275&fm=26&gp=0.jpg"> | ||
112 | <span class="tj-title"> | ||
113 | 爬山虎国土空间信息化解决方案终极方案 | ||
114 | </span> | ||
115 | <span class="tj-date"> | ||
116 | 2020-12-12 | ||
117 | </span> | ||
118 | </div> | ||
119 | </div> | ||
120 | <div class="right-bottom"> | ||
121 | <div class="right-bottom-top"> | ||
122 | <span>政策法规推荐</span> | ||
123 | </div> | ||
124 | <div class="zcfg"> | ||
125 | <div class="zcfg-top"> | ||
126 | <span>爬山虎国土空间规划信息化解决</span> | ||
127 | </div> | ||
128 | <div class="zcfg-body"> | ||
129 | <span>10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形势。</span> | ||
130 | </div> | ||
131 | <div class="zcfg-bottom"> | ||
132 | <span>2020-10-28</span> | ||
133 | </div> | ||
134 | </div> | ||
135 | <div class="zcfg"> | ||
136 | <div class="zcfg-top"> | ||
137 | <span>爬山虎国土空间规划信息化解决</span> | ||
138 | </div> | ||
139 | <div class="zcfg-body"> | ||
140 | <span>10月21日,农业农村部举行新闻发布会,介绍2020年前三季度农业农村经济形势。</span> | ||
141 | </div> | ||
142 | <div class="zcfg-bottom"> | ||
143 | <span>2020-10-28</span> | ||
144 | </div> | ||
145 | </div> | ||
146 | </div> | ||
147 | </div> | ||
148 | </div> | ||
149 | </body> | ||
150 | </html> | ||
151 | <!--[if (gte IE 9)|!(IE)]><!--> | ||
152 | <script type="text/javascript" src="../../lib/jquery/jquery.min.js"></script> | ||
153 | <!--<![endif]--> | ||
154 | <script type="text/javascript" src="../../lib/handlebars/handlebars.min.js"></script> | ||
155 | <script type="text/javascript" src="../../lib/iscroll/iscroll-probe.js"></script> | ||
156 | <script type="text/javascript" src="../../lib/amazeui/amazeui.min.js"></script> | ||
157 | <script type="text/javascript" src="../../lib/raty/jquery.raty.js"></script> | ||
158 | <script type="text/javascript" src="../../js/main.min.js?t=1"></script> | ||
159 | <script type="text/javascript" src="../../lib/layui/layui.js"></script> | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
-
Please register or sign in to post a comment