输入自己买的域名可以访问到自己github上的网页

需求:在腾讯云上买了一个域名,现在想通过在浏览器中输入域名,能打开自己写的网页.

步骤:

1、在github上面新建一个仓库,必须公开的仓库,不能是私有的,把项目代码push进去。 一定要仓库下面直接是文件,不要又包一层文件夹。这里我的页面内容在是a.html里面。

输入自己买的域名可以访问到自己github上的网页

这里有个问题:我本来是想,直接域名输完就可以访问到页面的,但是不行,在chatGPT上搜了下,说建一个index.html页面,然后里面重定向到 a.html上,就可以实现输入域名直接访问页面。但是试了下并不行,还是域名输完后要输入口文件才行www.anniexcathee.love/a.html a.html不能省略
index.html文件内容如下

输入自己买的域名可以访问到自己github上的网页

2、找到这个项目的settings的Pages,然后如下图做一些配置, 这里custom domain先别配置,等第3步完成了再来配置 域名前面也可以没有www,这个主要看你的域名里面怎么配置的,往下看会有

输入自己买的域名可以访问到自己github上的网页

别忘了勾选 Enforce HTTPS,这样你的网址 通过https协议访问

输入自己买的域名可以访问到自己github上的网页

3、进入你买域名的网站,我是在腾讯云上买的域名,进入域名管理后,点击添加记录,新添加一条,主机记录我这里写的是www. 我是这样配置的

输入自己买的域名可以访问到自己github上的网页

4、再回到 github 项目对应的 setting pages里面,在custom domain里面加上自己购买的域名,加好后点保存

输入自己买的域名可以访问到自己github上的网页

5、最后根据生成的网址,在浏览器中打开,末尾加上自己的入口文件,就可以看到了

输入自己买的域名可以访问到自己github上的网页

输入自己买的域名可以访问到自己github上的网页

总结:
最后按照上面的步骤,总算实现了。安卓手机打开可能会比较慢,因为使用的github,加上图片也大,800k-1.2M

最后说一个自己遇到的适配问题:
div之间会有空白间隙,我这里页面上是5个div,里面放的图片,所以浏览器上打开网页后发现,每个div之间都有 4px的空白。
解决:div 上 加margin-bottom: -4px
加上后发现,安卓手机 和电脑上都没问题,但是 苹果手机上还是有 1px的留白。因为我这个是 个人简单网页,要求不复杂,所以修改就是:手机移动端时,把-4px改成-5px

输入自己买的域名可以访问到自己github上的网页

原文链接:https://juejin.cn/post/7324585777636147240 作者:飞奔的程序员

(0)
上一篇 2024年1月17日 下午4:26
下一篇 2024年1月17日 下午4:39

相关推荐

发表回复

登录后才能评论