如何利用GitHub设计一个炫酷的个人网站(含代码)
1.在开始制作之前我们先预览一下我的网站吧!
1.方式一:
由于是手机版的所以用手机访问下面的链接体验比较好一点:
https://tom-shushu.github.io/MyWeb.github.io/
2.方式二:
你也可以在我博客的右侧扫描我的网站二维码进行访问;
2.具体制作过程:
开发工具:Github Desktop ,GitHub,Hbuilder(纯静态网页)
1.第一步:
作为一个程序员你一定有GitHub吧,如果没有你需要注册一个GitHub账号:具体步骤请按照下面步骤进行操作:
https://blog.csdn.net/qq_35246620/article/details/67636563
2.第二步:
在GitHub上建立一个仓库如图所示:
1>.名字自己起,注意必须以 .github.io结尾(由于我这里已经建好所以会出现错误)

2>.然后用Github Desktop工具将刚才建立的仓库克隆到本地,如果不了解Github Desktop工具的可以查看:
https://www.jianshu.com/p/06a960d991aa

我这里已经克隆下来了
打开MyWeb.github.io:里面就只有一个.git文件

3>.编码:
关于编码这里我就步详细介绍了,有点关公面前耍大刀,哈哈。如果觉得我这个网站还比较炫酷你可以到我的GitHub上去免费下载:
https://github.com/Tom-shushu/MyWeb.github.io
将我的信息更改一下就可以了。
4>.上传项目到GitHub上:
将整个项目拷贝到刚才克隆下来的仓库之中,用Github Desktop进行上传即可;
5>.到GitHub远程仓库的setting中将Source改为master branch

之后它会给你生成一个访问网址,它就是你的网站访问网址:

点击就可访问了
https://tom-shushu.github.io/MyWeb.github.io/
如何利用GitHub设计一个炫酷的个人网站(含代码)的更多相关文章
- 一个炫酷的flash网站模板
这是一个炫酷的flash欧美网站模板,它包括首页,公司简介,留言等五个页面,界面转换非常的炫酷!他还有时间.全屏.背景音乐开关的功能!有兴趣的朋友可以看看!贴几张网站图片给大家看看! 下载后直接找到s ...
- 利用UIWebView打造一个炫酷的视频背景视图(OC & Swift)
http://www.cocoachina.com/ios/20151023/13860.html 2015-10-6更新:适配 Swift2.0 如有需要,可以通过pjin.elvin@gmail. ...
- 利用GitHub制作在线炫酷简历
首先我们先体验一下炫酷简历.然后决定我们要不要使用. https://jessezhao1990.github.... 如何使用本项目部署你自己的在线简历 1. 书写简历 在src文件夹里面有个con ...
- canvas的进阶 - 学习利用canvas做一个炫酷的倒计时功能
先给大家贴一张图片,因为我不会上传视频( ̄□ ̄||) ,请大家谅解了~ 如果有知道怎么上传视频的大神还请指点指点 ^_^ ~ 然后看一下代码: html部分 : <!DOCTYPE html ...
- 百度前端技术学院2018笔记 之 利用 CSS animation 制作一个炫酷的 Slider
前言 题目地址 利用 CSS animation 制作一个炫酷的 Slider 思路整理 首先页面包含三种东西 一个是type为radio的input其实就是单选框 二是每个单选框对应的label 三 ...
- 一个炫酷的Actionbar效果
今天在网上看到一个炫酷的Actionbar效果,一个老外做的DEMO,目前很多流行的app已经加入了这个效果. 当用户初始进入该界面的时候,为一个透明的 ActiionBar ,这样利用充分的空间显示 ...
- 2019基于Hexo快速搭建个人博客,打造一个炫酷博客(1)-奥怪的小栈
本文转载于:奥怪的小栈 这篇文章告诉你如何在2019快速上手搭建一个像我一样的博客:基于HEXO+Github搭建.并完成SEO优化,打造一个炫酷博客. 本站基于HEXO+Github搭建.所以你需要 ...
- Android一个炫酷的树状图组织架构图开源控件实现过程
Android一个炫酷的树状图组织架构图开源控件 文章目录 [1 简介] [2 效果展示] [3 使用步骤] [4 实现基本布局流程] [5 实现自由放缩及拖动] [6 实现添加删除及节点动画] [7 ...
- 教你用canvas打造一个炫酷的碎片切图效果
前言 今天分享一个炫酷的碎片式切图效果,这个其实在自己的之前的博客上有实现过,本人觉得这个效果还是挺炫酷的,这次还是用我们的canvas来实现,代码量不多,但有些地方还是需要花点时间去理解的,需要点数 ...
随机推荐
- 使用elementUI的时候,使用Upload 上传的时候,使用 list-type 属性来设置文件列表的样式,before-upload方法失效
最近在做项目的时候,使用elementUI的时候,使用Upload 上传的时候,before-upload方法失效. 情况下:使用 list-type 属性来设置文件列表的样式. 最终的优化之后:(演 ...
- 《HelloGitHub》第 36 期
公告 本期内容较多.本期共有 41 个项目:C# 项目(1),C++ 项目(1),CSS 项目(2),Go 项目(5),Java 项目(2),JavaScript 项目(5),Objective-C ...
- 服务部署到Swarm Cluster中
对于已存在的镜像,将其部署到服务器中并开始对外服务,便是它的职责,而我们要做的便是帮助它完成职责,前两个应用环节都已产生了相应的镜像,在这一环节,将完成服务部署到容器集群的工作,对于这一过程,实际执行 ...
- Java虚拟机一:运行时数据区域
java虚拟机在执行java程序的过程中,会把内存划分为若干个不同的数据区域.每个区域都有各自的用途,创建和销毁时间,按照<java虚拟机规范(Java SE 7 版)>的规定,虚拟机运行 ...
- Java设计模式小议之1------- 迭代器模式
定义:提供一种方法访问一个容器对象中各个元素,而又不暴露该对象的内部细节. 类型:行为类模式 这里用一个具体的案例来说明一下迭代器模式的简单使用 我们都知道在商店中,经常要把商品放到书架上,并将商品的 ...
- 代码规范:idea上添加阿里巴巴Java开发插件
在一个项目中,不可缺少的是书写代码的规范,没有好的代码规范约束,大家各写各的,十分不利于代码的维护与修改. 首先来看看如何在idea上添加这个插件: 直接上图 点击右边的蓝色按钮就可以安装了, ...
- Linux基本操作——文件相关
一.前言 无论是IC工程师.FPGA工程师还是嵌入式软件工程师,都或多或少会接触到Linux操作系统.有很多EDA工具只有Linux版本,因此掌握基本的操作和常用命令十分必要.Linux中的数据均以文 ...
- PXE安装windows系统,pxe-e55:ProxyDhcp service did not reply to request on port 4011
这个pxe-e55" 错误表示 pxe 客户端已向端口4011上的代理 dhcp 服务器发送请求, 但未收到答复.似乎只有在dhcp 服务器上设置了 dhcp 类标识符选项 #60, 但同一 ...
- 分布式之 BASE理论
------------------------------珍惜眼前的学习机会,当你现在有机会学习各种经验时,一定要倍加珍惜.靠混日子是混不了一辈子的,许多过程都是不能省略的,至少学会这些经验可以让你 ...
- Kali Linux 渗透测试手册(1.1)安装虚拟机
翻译来自:掣雷小组 成员信息: thr0cyte, Gr33k, 花花, 小丑, R1ght0us, 7089bAt, 一.配置KALI Linux和渗透测试环境 在这一章,我们将覆盖以下内容: 在W ...