1.建立个人github pages 仓库

  • 创建新仓库,命名规则为----“你的github账号.github.io”, 如图所示:

  • 我的账号是zxpsuper,所以我的个人域名仓库为 zxpsuper.github.io
  • 点击这个新建的仓库,找到setting,找到github pages 模块

  • 把 none 改为 master branch ,点击 save 保存。
  • 然后将你的页面命名为 index.html 上传到此仓库,在浏览器输入:

    zxpsuper.github.io

便可以看到你的页面效果!

2.拓展更多

  • 这部分内容是对github pages 的拓展,可以不了解
  • 重复1中之间的内容,新建一个新的仓库,如图1中的testMusic,上传页面和静态文件到此仓库

  • 然后在浏览器中输入:

    zxpsuper.github.io/testMusic/index.html

    或 zxpsuper.github.io/testMusic

    即可看到效果!

觉得有用就点个赞呗!!(づ。ᴗᴗ。)づ

在github上实现页面托管预览功能的更多相关文章

  1. 分离与继承的思想实现图片上传后的预览功能:ImageUploadView

    本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图 ...

  2. JS页面打印预览功能

    点击按钮后就可以直接打印预览,并且隐藏了按钮,如果你不希望按钮显示,可以把那部分代码删除就可以了. <html><head><meta http-equiv=" ...

  3. javascript实现文件上传之前的预览功能

    1.首先要给上传文件表单控件和图片控件设置name属性 <div class="form-group">                    <label fo ...

  4. jquery实现图片上传前本地预览功能

    HTML <img id="pic" src="" > <input id="upload" name="fil ...

  5. 【小月博客】用HTML5的File API做上传图片预览功能

    前段时间做了一个项目,涉及到上传本地图片以及预览的功能,正好之前了解过 html5(点击查看更多关于web前端的有关资源) 可以上传本地图片,然后再网上看了一些demo结合自己的需求,终于搞定了.(P ...

  6. [.ashx檔?泛型处理例程?]基础入门#2....FileUpload上传前,预览图片(两种作法--ashx与JavaScript)

    原文出處  http://www.dotblogs.com.tw/mis2000lab/archive/2013/08/20/ashx_beginner_02_fileupload_picture_p ...

  7. 图片上传前的预览(PHP)

    1.先创建一个file表单域,我们需要用它来浏览本地文件.<form name="form1" id="form1" method="post& ...

  8. 通过修改ajaxFileUpload.js实现多图片动态上传并实现预览

    参考:http://smotive.iteye.com/blog/1903606 大部分我也是根据他的方法修改的,我也要根据name实现动态的多文件上传功能,但是有个问题使我一直无法实现多文件上传. ...

  9. 上传图片,多图上传,预览功能,js原生无依赖

    最近很好奇前端的文件上传功能,因为公司要求做一个支持图片预览的图片上传插件,所以自己搜了很多相关的插件,虽然功能很多,但有些地方不能根据公司的想法去修改,而且需要依赖jQuery或Bootstrap库 ...

随机推荐

  1. 线性代数-矩阵-【2】矩阵生成 C和C++实现

    矩阵的知识点之多足以写成一本线性代数. 所以我们把矩阵的运算封装成矩阵类.以C++为主进行详解. 点击这里可以跳转至 [1]矩阵汇总:http://www.cnblogs.com/HongYi-Lia ...

  2. 一位资深程序员大牛给予Java提升技术的学习路线建议

    15套java架构师.集群.高可用.高可扩 展.高性能.高并发.性能优化.Spring boot.Redis.ActiveMQ.Nginx.Mycat.Netty.Jvm大型分布 式项目实战视频教程 ...

  3. 对Appium的认识 get

    介绍 Appium是一个开源.跨平台的测试框架,可以用来测试原生及混合的移动端应用.Appium支持iOS.Android及FirefoxOS平台测试.Appium使用WebDriver的json w ...

  4. java面向对象(三)之抽象类,接口,向上转型

    java类 java类分为普通类和抽象类,接口,上一节我大概讲了java类的一般格式,今天将抽象类和接口.同时讲一下它们是怎样存储的. 最重要的是理解为什么要有抽象和接口,这样学下来你猜不会迷茫,才能 ...

  5. ElasticSearch和Kibana 5.X集群的安装

    ElasticSearch和Kibana 5.X集群的安装 1.准备工作 1.1.下载安装包 1.2.系统的准备 2.ElasticSearch集群的安装 2.1.修改 config/elastics ...

  6. javascript学习笔记-4

    document.getElementByTagName返回的是一个NodeList,这个NodeList和js数组很类似,都可以使用下标读取,如:array[0],但他们也有不同,不同在于不能对No ...

  7. ASP.NET Core Web服务器 Kestrel和Http.sys 特性详解

    ASP.NET Core Web服务器 Kestrel和Http.sys 特性详解 1.1. 名词解释 1.2. Kestrel基本工作原理 1.2.1. Kestrel的基本架构 1.2.2. Ke ...

  8. tkinter第四章 输入框,校对

    #最简单的输入框 import tkinter as tk root = tk.Tk() e = tk.Entry(root)#输入框的类 e.pack() e.delete(0,tk.END)#把输 ...

  9. Vue项目搭建基础之Vue-cli模版测试

    第一步安装node,nodejs.org下载node稳定版安装包.node -v   (查看node版本)npm install -g vue-cli(安装Vue脚手架环境)vuevue listvu ...

  10. Spring Ioc DI 原理

    IOC(DI):其实这个Spring架构核心的概念没有这么复杂,更不像有些书上描述的那样晦涩.Java程序员都知道:java程序中的每个业务逻辑至少需要两个或以上的对象来协作完成,通常,每个对象在使用 ...