kkGitHub上有趣的资源

利用github pages搭建静态网站

2019-05-06  本文已影响19人  Yooking

本文首发于KUNOTE公众号


什么是GitHub Pages?

GitHub Pages是一种静态站点托管服务,直接把你的页面托管到GitHub存储库。

官方说明你可以使用Jekyll Theme Chooser在线创建和发布GitHub Pages网站。当然你可以在本地工作,可以使用GitHub Desktop或命令行。

GitHub Pages不支持服务器端代码,如PHP,Ruby或Python。

(一)注册账号

访问 github : https://github.com/

注册账号 : 输入用户名、E-mail、密码点击 sign up(注意去邮箱验证账号)

如下三步只要九年义务英语过关就能看懂。

(二) 创建repository

登陆进去点New repository,创建新的存储库。

这里repository name的内容有要求:

用户名.github.io

比如我的用户名为yookingwong我就要用yookingwong.github.io点击Create repository

(三) 充实你的库

现在你的存储库是空的 你可以用它的客户端或者git命令行为你的库上传文件,但是这篇文章作为基础先不写如何使用它们。我们直接点击蓝色超链接creating anewfile

如下: 在小输入框输入index.html,我将要创建一个html文件作为我们网站的首页。

如果你不了解html可以先粘贴如下内容到大输入框:

<html>

       <style>

               body {

                   line-height:30px;

                   background-color:#81ecec;

               }

               #main {

                   text-align: center;

                   position: relative;

                   top: 15%;

                   color: #ffffff;

                   font-size:3rem;

                   line-height:5rem;

               }

               #ad {

                   position: absolute;

                   right: 0px;

                   bottom: 0px;

                   color: #ffffff;

               }

               </style>    

   <body>

       <div id=main>

           春晓</br>

           作者:孟浩然</br>

           春眠不觉晓,处处闻啼鸟。</br>

           夜来风雨声,花落知多少。</br>

       </div>

       <div id=ad>

           <img src="https://yooking.github.io/img/qrcode_for_gh_9ae9c8b0949b_258.jpg"></img>

       </div>

   </body>

</html>

4.点击commit new file即可 

(四) 访问你的用户名.github.io

大功告成!

上一篇下一篇

猜你喜欢

热点阅读