超炫酷精致的个人网站模板

【实例简介】
该个人网站一共有8个页面。首先博客的登录界面login.html:是利用html5和css3结合写出的一个超炫酷的页面，根据canvas粒子制作出背景具有动态的效果。登陆后根据存入数据进行比对，对其用户名、密码、验证码验证，只有通过验证后才能登录成功并且验证成功后可以达到全屏的效果。每一个页面分为footer body和footer三部分组成。头部主要就是标题栏，尾部是页脚，中间就是主题内容。index.html主页：主要就利用js焦点滚动式轮播插入图片和文字自行进行翻页，其他主要利用div和css进行控制每一个内容框。利用链接跳转到相对应的内容上。可以根据标题、标签、关键字等点击到另一个内容
【实例截图】
【核心代码】
个人博客
└── 个人博客
├── about.html
├── article.html
├── article_detail.html
├── blog
│   ├── bootstrap
│   │   ├── css
│   │   │   ├── bootstrap-theme.css
│   │   │   ├── bootstrap-theme.css.map
│   │   │   ├── bootstrap-theme.min.css
│   │   │   ├── bootstrap-theme.min.css.map
│   │   │   ├── bootstrap.css
│   │   │   ├── bootstrap.css.map
│   │   │   ├── bootstrap.min.css
│   │   │   └── bootstrap.min.css.map
│   │   ├── fonts
│   │   │   ├── glyphicons-halflings-regular.eot
│   │   │   ├── glyphicons-halflings-regular.svg
│   │   │   ├── glyphicons-halflings-regular.ttf
│   │   │   ├── glyphicons-halflings-regular.woff
│   │   │   └── glyphicons-halflings-regular.woff2
│   │   └── js
│   │   ├── bootstrap.js
│   │   ├── bootstrap.min.js
│   │   └── npm.js
│   ├── jquery.min.js
│   ├── jquery.page.css
│   └── jquery.page.js
├── comment.html
├── css
│   ├── about.css
│   ├── article.css
│   ├── article_detail.css
│   ├── bootstrap.min.css
│   ├── common.css
│   ├── default.css
│   ├── demo.css
│   ├── loaders.css
│   ├── moodList.css
│   ├── normalize.css
│   └── styles.css
├── effect.png
├── fun.html
├── images
│   ├── 88_thumb.gif
│   ├── angrya_thumb.gif
│   ├── bba_thumb.gif
│   ├── bg.jpg
│   ├── boboshengmenqi_thumb.gif
│   ├── bofubianlian_thumb.gif
│   ├── bs2_thumb.gif
│   ├── bs_thumb.gif
│   ├── bz_thumb.gif
│   ├── cake.gif
│   ├── camera_thumb.gif
│   ├── cat_yunqizhong_thumb.gif
│   ├── cf_thumb.gif
│   ├── chn_buyaoya_thumb.gif
│   ├── cj_thumb.gif
│   ├── clock_thumb.gif
│   ├── come_thumb.gif
│   ├── cool_thumb.gif
│   ├── crazya_thumb.gif
│   ├── cry.gif
│   ├── cza_thumb.gif
│   ├── daxiongleibenxiong_thumb.gif
│   ├── dizzya_thumb.gif
│   ├── fuyun_thumb.gif
│   ├── gbzkun_thumb.gif
│   ├── geili_thumb.gif
│   ├── good_thumb.gif
│   ├── gza_thumb.gif
│   ├── h_thumb.gif
│   ├── hatea_thumb.gif
│   ├── hearta_thumb.gif
│   ├── heia_thumb.gif
│   ├── horse2_thumb.gif
│   ├── hsa_thumb.gif
│   ├── hufen_thumb.gif
│   ├── j_thumb.gif
│   ├── k_thumb.gif
│   ├── kbsa_thumb.gif
│   ├── kl_thumb.gif
│   ├── laugh.gif
│   ├── lazu_thumb.gif
│   ├── ldln_thumb.gif
│   ├── liwu_thumb.gif
│   ├── lovea_thumb.gif
│   ├── lxhluguo_thumb.gif
│   ├── lxhzhuanfa_thumb.gif
│   ├── m_thumb.gif
│   ├── mb_thumb.gif
│   ├── money_thumb.gif
│   ├── nm_thumb.gif
│   ├── no_thumb.gif
│   ├── ok_thumb.gif
│   ├── otm_thumb.gif
│   ├── panda_thumb.gif
│   ├── pig.gif
│   ├── qq_thumb.gif
│   ├── rabbit_thumb.gif
│   ├── sad_thumb.gif
│   ├── sada_thumb.gif
│   ├── sb_thumb.gif
│   ├── shamea_thumb.gif
│   ├── sk_thumb.gif
│   ├── sleepa_thumb.gif
│   ├── sleepya_thumb.gif
│   ├── smilea_thumb.gif
│   ├── sw_thumb.gif
│   ├── sweata_thumb.gif
│   ├── t_thumb.gif
│   ├── tootha_thumb.gif
│   ├── tx.jpg
│   ├── tza_thumb.gif
│   ├── unheart.gif
│   ├── vw_thumb.gif
│   ├── weijin_thumb.gif
│   ├── wg_thumb.gif
│   ├── wq_thumb.gif
│   ├── x_thumb.gif
│   ├── ye_thumb.gif
│   ├── yhh_thumb.gif
│   ├── youqian_thumb.gif
│   ├── yw_thumb.gif
│   ├── yx_thumb.gif
│   ├── z2_thumb.gif
│   ├── zhh_thumb.gif
│   ├── zy_thumb.gif
│   └── zz2_thumb.gif
├── img
│   ├── Starry.jpg
│   ├── Tower.jpg
│   ├── bg.jpg
│   ├── img1.jpg
│   ├── img2.jpg
│   ├── img3.jpg
│   ├── img4.jpg
│   ├── img5.jpg
│   ├── key.png
│   ├── lock_icon_copy.png
│   ├── mylogo.png
│   ├── puff.svg
│   ├── sight1.jpg
│   ├── sight2.jpg
│   ├── sight3.jpg
│   ├── sight4.jpg
│   ├── sight5.jpg
│   ├── sight6.jpg
│   ├── sight7.jpg
│   ├── slider
│   │   ├── 001.png
│   │   ├── heart.jpg
│   │   ├── shiguang.jpg
│   │   ├── slide1.jpg
│   │   ├── slide2.jpg
│   │   ├── slide3.jpg
│   │   ├── slide4.jpg
│   │   ├── slide6.jpg
│   │   ├── slide7.jpg
│   │   └── yuanfang.jpg
│   ├── snowy.png
│   ├── tab.png
│   ├── text01.jpg
│   ├── text02.jpg
│   ├── tick.png
│   ├── titlebg.png
│   └── user_icon_copy.png
├── index.html
├── js
│   ├── common.js
│   ├── jquery-1.10.2.min.js
│   ├── jquery-ui.min.js
│   ├── jquery.min.js
│   ├── jquery.mockjax.js
│   ├── particleground.js
│   ├── snowy.js
│   ├── stopExecutionOnTimeout.js
│   └── treatment.js
├── layui
│   ├── css
│   │   ├── global.css
│   │   ├── layui.css
│   │   ├── layui.mobile.css
│   │   └── modules
│   │   ├── code.css
│   │   ├── laydate
│   │   │   ├── icon.png
│   │   │   └── laydate.css
│   │   └── layer
│   │   └── default
│   │   ├── icon-ext.png
│   │   ├── icon.png
│   │   ├── layer.css
│   │   ├── loading-0.gif
│   │   ├── loading-1.gif
│   │   └── loading-2.gif
│   ├── lay
│   │   └── modules
│   │   ├── code.js
│   │   ├── element.js
│   │   ├── flow.js
│   │   ├── form.js
│   │   ├── laydate.js
│   │   ├── layedit.js
│   │   ├── layer.js
│   │   ├── laypage.js
│   │   ├── laytpl.js
│   │   ├── mobile.js
│   │   ├── tree.js
│   │   ├── upload.js
│   │   └── util.js
│   └── layui.js
├── login.html
└── moodList.html

19 directories, 196 files