文章目录

• 1.烟灰主题个人主页
• • 1.1 个人主页界面
  • 1.2 个人信息界面
  • 1.3 兴趣爱好界面
  • 1.4 个人作品界面
  • 2.紫霞主题个人主页
  • • 2.1 个人主页界面
    • 2.2 个人信息界面
    • 2.3 兴趣爱好界面
    • 2.4 个人作品界面
    • 3.墨夜主题个人主页
    • • 3.1 个人主页界面
      • 3.2 个人信息界面
      • 3.3 兴趣爱好界面
      • 3.4 个人作品界面
      • 4.海洋主题个人主页
      • • 4.1 个人主页界面
        • 4.2 个人信息界面
        • 4.3 兴趣爱好界面
        • 4.4 个人作品界面
        • 5.星际主题个人主页
        • • 5.1 个人主页界面
          • 5.2 个人信息界面
          • 5.3 兴趣爱好界面
          • 5.4 个人作品界面
          • 6.效果和源码
          • • 6.1 动态效果
            • 6.2 源代码
            • 6.3 资源结构
            • 源码下载

              作者：xcLeigh

              文章地址：https://blog.csdn.net/weixin_43151418/article/details/138708540

              ---

              HTML5实现简洁好看的个人主页(个人小站五种风格附源码)，个人主页源码，个人小站源码，五种风格对应五种常用主页菜单，学习类，展示类，制作类，成就类等，界面主题都是以按钮展开延申，展示个人信息，根据不同类型不同显示，对应图片文字可直接修改，各种风格都有，代码上手简单，代码独立，可以直接使用。也可直接预览效果。

              1.烟灰主题个人主页

              1.1 个人主页界面

                  烟灰主题个人主页，个人主页界面，内容由图标、名称、名言、欢迎语组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              1.2 个人信息界面

                  烟灰主题个人主页，个人信息界面，内容由个人相关信息组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              1.3 兴趣爱好界面

                  烟灰主题个人主页，兴趣爱好界面，内容由个人兴趣爱好列表，采用图文结合组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              1.4 个人作品界面

                  烟灰主题个人主页，个人作品界面，内容由个人作品的图文展示方式组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              2.紫霞主题个人主页

              2.1 个人主页界面

                  紫霞主题个人主页，个人主页界面，内容由图标、名称、名言、欢迎语组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              2.2 个人信息界面

                  紫霞主题个人主页，个人信息界面，内容由个人相关信息组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              2.3 兴趣爱好界面

                  紫霞主题个人主页，兴趣爱好界面，内容由个人兴趣爱好列表，采用图文结合组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              2.4 个人作品界面

                  紫霞主题个人主页，个人作品界面，内容由个人作品的图文展示方式组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              3.墨夜主题个人主页

              3.1 个人主页界面

                  墨夜主题个人主页，个人主页界面，内容由图标、名称、名言、欢迎语组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              3.2 个人信息界面

                  墨夜主题个人主页，个人信息界面，内容由个人相关信息组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              3.3 兴趣爱好界面

                  墨夜主题个人主页，兴趣爱好界面，内容由个人兴趣爱好列表，采用图文结合组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              3.4 个人作品界面

                  墨夜主题个人主页，个人作品界面，内容由个人作品的图文展示方式组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              4.海洋主题个人主页

              4.1 个人主页界面

                  海洋主题个人主页，个人主页界面，内容由图标、名称、名言、欢迎语组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              4.2 个人信息界面

                  海洋主题个人主页，个人信息界面，内容由个人相关信息组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              4.3 兴趣爱好界面

                  海洋主题个人主页，兴趣爱好界面，内容由个人兴趣爱好列表，采用图文结合组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              4.4 个人作品界面

                  海洋主题个人主页，个人作品界面，内容由个人作品的图文展示方式组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              5.星际主题个人主页

              5.1 个人主页界面

                  星际主题个人主页，个人主页界面，内容由图标、名称、名言、欢迎语组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              5.2 个人信息界面

                  星际主题个人主页，个人信息界面，内容由个人相关信息组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              5.3 兴趣爱好界面

                  星际主题个人主页，兴趣爱好界面，内容由个人兴趣爱好列表，采用图文结合组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              5.4 个人作品界面

                  星际主题个人主页，个人作品界面，内容由个人作品的图文展示方式组成，排版由上而下，下面隐藏个人相关操作跳转，当鼠标悬浮上去，就显现出来，可以操作个人主页、个人信息、兴趣爱好，个人作品等四个菜单页面，可以自定义增加、修改菜单名称或对应页面内容。

              6.效果和源码

              6.1 动态效果

                  这里是完整的效果演示，可在此代码基础上更加完善功能，支持扩展自己的风格，可以删减内容，打造属于自己的个人主页。

              HTML5实现简洁好看的个人主页(个人小站五种风格附源码)

              6.2 源代码

                  这里是主界面的代码，其他图片、js、css等代码，见下面的 源码下载 ，里面有所有代码资源和相关说明。