个人网站项目 （前端搭建）

目录

技术栈： SemanticUI + Jquery

项目目录结构

![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920111524834.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920111600273.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
一、
admin 文件夹： 后台页面
static -> lib 文件夹 ： （图书馆，依赖）按顺序分别为 集成MarkDown, prism 代码高亮显示，微信生成文章阅读 ，目录结构生成，页面滚动检测

二、
about.html 关于我页面
archives.html 文章归档页面
blog.html 网站首页
index.html 文章详情首页
tags.html 文章分类标签页
types.html 分类页

blogs.html 博客后台管理页
blogs-input.html 博客编写页

核心功能

按钮悬浮显示

关于我 页面 about.html
在这里插入图片描述
UI 模板及其Jquery 运用

赞赏按钮

博客内容页面 index.html
![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920114328440.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920114433776.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
UI 模板及其Jquery 运用

右下悬浮窗

在这里插入图片描述
![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920114653798.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
tocbot qrcode waypoints 的集成
UI 模板及其Jquery 运用

功能：
生成目录，跳转留言，微信扫码阅读，回到顶部

评论区

![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920114906271.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)
UI 框架的直接运用
![在这里插入图片描述]( https://img-blog.csdnimg.cn/20200920145442689.png?x-oss-process=image/watermark ,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1F1YW50dW1Zb3U=,size_16,color_FFFFFF,t_70#pic_center)

posted @ 2020-09-20 15:15  QuantumYou  阅读(611)  评论(0)    收藏  举报
/* 点击爆炸效果*/ /* 鼠标点击求赞文字特效 */ /*鼠标跟随效果*/