用Github Pages展现你的项目

Github Pages

Github Pages,websites for you and your projects.
Hosted directly from your GitHub repository. Just edit, push, and your changes are live.

Github Pages，让用户可以自定义项目首页，同时，让其编写的网页可以经过域名访问直接展现出来。Github Pages被看成是用户编写的、托管在github上的静态网页，Github提供了必定的空间供开发者存放静态网页。

Github Pages类型

1. User/Organization Pages（我的或公司站点）

   • 这种类型的Pages经过新建一个仓库创建，以本身的用户名命名，且每一个用户名只能创建 一个；

   • 仓库主干（master）上内容被用来构建和发布页面

   • 多用于创建我的博客

2. Project Pages 项目站点

   • 这种类型的仓库经过修改项目的Setting创建，一个项目只能创建一个；

   • 仓库新建了一个gh-pages分支用于构建和发布页面；

   • 多用于展现项目效果

而此次咱们要讲的就是Project Pages（项目站点），过程十分简单，10分钟搞定。

Project Pages

操做

1. 进入项目仓库，点击Settings：
   

2. 在Options选项右侧，有一Panel为Github Pages，点击Launch automatic page generator：

3. 设置参数：name、tagline、body。
   body为首页内容（为第6点所示），支持markdown语法：

4. 选择首页模板，不一样模板，展现效果不一样：
   

5. 建立pages成功，在settings页面可看到page域名，可经过此域名访问你的page：
   

6. 刚刚选择的是默认模板，访问域名http://ferunner.github.io/IFE/后效果如图：

7. 那么，如何自定义本身想要的页面样式呢？
   去往code界面，你会发现分支下多了个gh-pages分支，这是刚刚生成page后自动建立的分支，用于管理（构建和发布页面）Project Page：

8. 进入gh-pages分支，可往分支增删文件，以实现本身想要的效果：
   

9. 那么，克隆该仓库到本地，切换到gh-pages分支。
   在这里，我新增了t_1.1和t_1.2两个文件夹，里面均放着对应的html和css文件。推送到远程仓库，更新文件。

10. 进入远程仓库：

11. 访问http://ferunner.github.io/IFE/t_1.1/t_1.1.html，便可看到你要展现的html页面：

自此，你的项目的Project Page算是完成。若要更改首页效果，则更改gh-pages分支下的index.html文件及样式文件。