美文网首页kkGitHub上有趣的资源
利用github pages搭建静态网站

利用github pages搭建静态网站

作者: Yooking | 来源:发表于2019-05-06 18:07 被阅读19次

    本文首发于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

    大功告成!

    相关文章

      网友评论

        本文标题:利用github pages搭建静态网站

        本文链接:https://www.haomeiwen.com/subject/vxektttx.html