前端项目 – 论坛信息管理系统（纯页面）

目录

预览效果

0. 文件夹列表说明

1. 实现论坛列表页

1.1 论坛列表页 – list.html

1.2 导航栏公用的css – naviddation bar.css

1.3 主页和正文页面 公用的个人信息 – common.css 

1.4 论坛列表页 – list.css 

2. 实现论坛正文页

2.1 论坛正文页 – detail.html

2.2 论坛正文页 – detail.css

3. 实现论坛登陆页

3.1 论坛登陆页 – login.html

3.2 论坛登陆页 – login.css      

4. 实现论坛注册页

4.1 论坛注册页 – logon.html

4.2 论坛注册页 – logon.css    

5. 实现帖子编辑页

5.1 帖子编辑页 – editor.html

5.2 帖子编辑页 – editor.css     

【大家好，我是爱干饭的猿，如果喜欢这篇文章，点个赞，关注一下吧，后续会持续分享页面改进和与后端连接的相关操作】

预览效果

实现一个简单的论坛信息管理系统 . 当前先完成页面设计的部分 . 通过前端知识来构建出网页 .

主要分成五个页面 :

• 论坛列表页
• 论坛正文页
• 论坛登陆页
• 论坛注册页
• 帖子编辑页    

1. 论坛列表页

 

2. 论坛正文页

img class=”aligncenter” src=”https://img-blog.csdnimg.cn/45e2f25d9f2a4ac68d01dcd7b8d5e00c.png” width=”1200″>

 

3. 论坛登陆页

4. 论坛注册页

5. 帖子编辑页

0. 文件夹列表说明

1. 先看一下相应代码文件夹列表位置

• 论坛列表页 – list.html
• 论坛正文页 – detail.html
• 论坛登陆页 – login.html
• 论坛注册页 – logon.html
• 帖子编辑页 – editor.html

2. 其中css文件夹中有

detail.css                 – 论坛正文页

editor.css                 – 帖子编辑页

list.css                     – 论坛列表页

login.css                  – 论坛登陆页

logon.css                 – 论坛注册页

naviddation bar.css – 导航栏公用的css 

common.css            – 主页和正文页面 公用的个人信息

3. 其中img文件中存放的是页面所需要的图片

可以自行导入

4. 其中editor文件夹中存放的是 Markdown 编辑器

editor.md 是一个开源的页面 markdown 编辑器组件

在实现帖子编辑页时需要用到

下载网址：markdown 编辑器

1. 实现论坛列表页

1.1 论坛列表页 – list.html

来源：爱干饭的猿