博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
前端项目课程4 如何快速布局网页后台
阅读量:5993 次
发布时间:2019-06-20

本文共 12237 字,大约阅读时间需要 40 分钟。

前端项目课程4 如何快速布局网页后台

一、总结

一句话总结:套用bootstrap,然后需要的模块(比如导航、分页、模态框等)直接去bootstrap里面拖即可。

 

1、如何留出上端固定导航条的位置?

用的padding,而不是加div

给body设置padding即可

16         body{ 17             padding-top:70px; 18 }

 

2、如何使用框架(比如bootstrap)里面的各种样式?

a、用样式

b、样式不合意,找到样式的样式名,然后修改即可

.navba-brand本来是bootstrap里面的样式

11         .navbar-brand{ 12             color:#fff!important; 13 font-weight: bold; 14 }

 

3、弹出框用什么(比如修改密码的时候)?

模态框

使用的话超简单,直接进去拷就行了

 

4、如果bootstrap里面比如分页弄过来的代码不是预期要求,但是它上面显示的是预期要求,你怎么用这个样式?

检查里面拷贝源代码即可

列出的代码可能有问题,但是显示正常的源代码一定是没有问题的

 

5、后台如何实现模块化开发(区域自治)?

每个模块占单独的一个文件夹,这样也特别不容易错,要区域自治

 

 

二、如何快速布局网页后台

1、截图

 

 

 

 

2、代码

admin/index.html

1   2   3   4     
5 酒仙网后台 6 20
21 22 23 24 25 26 27
28
57 58
85 86 87
88
89
90
91
98
99
103
104
105 106
107
114
122
123 124
125
132
140
141 142
143
150
158
159 160
161
168
176
177 178
179
186
194
195 196
197
204
212
213 214
215 216
217 218
219
220
221
222
223

酒仙网后台信息:

224

联系方式: 0351-2728453

225

226 网站首页 227 退出系统228

229
230
231
232
233
234 235

 

admin/user/inde.html

1   2   3   4     
5 酒仙网后台 6 20
21 22 23 24 25 26 27
28
57 58
85 86 87
88
89
90
91
98
99
103
104
105 106
107
114
122
123 124
125
132
140
141 142
143
150
158
159 160
161
168
176
177 178
179
186
194
195 196
197
204
212
213 214
215 216
217 218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237 238
239
240
241
242
243
244
245
246 247
248
249
250
251
252
253
254
255 256
257
258
259
260
261
262
263
264 265
266
267
268
269
270
271
272
273 274
275
276
277
278
279
280
281
282 283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
编号 用户名 密码 注册时间 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
1 user1 123 2016-5-31 修改 删除
308 309
318
319
320
321 322

 

admin/user/add.html

1   2   3   4     
5 酒仙网后台 6 20
21 22 23 24 25 26 27
28
57 58
85 86 87
88
89
90
91
98
99
103
104
105 106
107
114
122
123 124
125
132
140
141 142
143
150
158
159 160
161
168
176
177 178
179
186
194
195 196
197
204
212
213 214
215 216
217 218
219
220
221
222
223
224
225 226
227
228
229
230 231
232
233
234
235 236
237
238
239
240
241
242
243
244 245

 

 

 

 

转载地址:http://ihtlx.baihongyu.com/

你可能感兴趣的文章
Securecrt emacs/vi 代码无法高亮、无颜色
查看>>
jQuery获取Select选中的Text和Value,根据Value值动态添加属性
查看>>
ASP.NET MVC中实现多个button提交的几种方法
查看>>
树与森林的存储、遍历和树与森林的转换
查看>>
CSS设计指南之浮动与清除
查看>>
Servlet3.0之八:基于Servlet3.0的文件上传@MultipartConfig
查看>>
adb shell am 的用法
查看>>
codeforces 85D D. Sum of Medians Vector的妙用
查看>>
Android进程的内存管理分析
查看>>
php -- 反射ReflectionClass
查看>>
Nginx反向代理和负载均衡部署指南
查看>>
java获取当前日期时间代码总结
查看>>
互联网广告学——程序化购买
查看>>
新版本chrome浏览器控制台怎么设置成独立的窗口
查看>>
oracle中nvarchar2字符集不匹配
查看>>
Mysql5.6.22源代码安装
查看>>
每天一个linux命令(5):rm 命令
查看>>
mksquash_lzma-3.2 编译问题
查看>>
【转帖】C# DllImport 系统调用使用详解 托管代码的介绍 EntryPoint的使用
查看>>
PHP JAVA Bridge桥的最新使用
查看>>