新建文件夹
安装express ejs
新建静态资源目录static
ejs模板目录views
新建views/indexejs
app.js
在app.js 引入express模板 配置路由
设置ejs引擎模板
新建路由文件router/router.js
在app.js引入router.js
在router.js写模块暴露
引入bootstrap模板
static/css/bootstrap.min.css
在index.ejs 中引入bootstrap模板 link 删除container-fluid 的槽宽
新建index.css并引入
在index.ejs写主页面 的title
list-inline-item(li) list-inline(ul) 去点class
文字垂直居中
删除固有样式margin bottom
新建views/header.js
在把 index.ejs复制到header.ejs
在index.ejs绑定header.ejs的数据
安装mysql
在mysql里新建blog数据库
新建文件mysql/setting.js
mysql/connextion.js数据库连接引入settings文件
在mysql中新建导航表
在connection.js中拿表中数据
新建sql.js
在routrt.js中 对nodejs获取的mysql数据进行转换
在header.ejs 循环绑定title数据
不同的字有不同的class
搜索框
行级元素 vertical-align：middle
search>input search>span
添加jquery库放入static在index.ejs引入jquery link
新建static/js/index.js 在index.ejs连接index.js
搜索框的显示与隐藏jquery
搜索框下的布局
新建mysql个人信息表
填一组数据
在router.js中添加渲染数据
把title的拿数据做一下调整
在“/”路由下加载其他数据
在index.ejs进行第二组数据的绑定
图片的设置
text-align center
line-height 3rem
四个图标的点击
线条的变化
线条的显示隐藏
index.js
不同选项卡的不同界面
