如何用github展示demo效果？

Wuv1Up 發(fā)布于2019-08-01 16:23 / 3296人閱讀

摘要：前言自己也在網(wǎng)上找過關(guān)于上展示靜態(tài)網(wǎng)頁效果的資料，但是還是有點(diǎn)稀里糊涂，下面說一下自己的方法，如果有更好的方法，歡迎交流討論。

前言

自己也在網(wǎng)上找過關(guān)于github上展示靜態(tài)網(wǎng)頁效果的資料，但是還是有點(diǎn)稀里糊涂，下面說一下自己的方法，如果有更好的方法，歡迎交流討論。

這是我的github地址：FatDong1的github

首先

打開你所要展示的github中的repository，例如我的是“2017ife”，然后打開setting

然后

往下拉，找到下面的Github Pages

接著點(diǎn)擊旁邊的save，然后往下拉我們可以在看到，多了一個(gè)地址

最后

我們?cè)谶@個(gè)地址上加上我們的文件夾里所要展示的網(wǎng)頁就可以了，我在awesome-demo文件夾里放了一個(gè)叫做3D輪播圖的文件夾，文件夾里面是index.html，所以我的展示地址為https://fatdong1.github.io/awesome-demo/3D輪播圖/index.html

我的github地址：https://github.com/FatDong1

添加

感謝評(píng)論的小伙伴添加了一點(diǎn)知識(shí)，真是活到老學(xué)到老阿，就是如果你的展示文件為index.html，則可以路徑中可以不寫index.html，還是上面的栗子，展示地址也可以變?yōu)?b>https://fatdong1.github.io/awesome-demo/3D輪播圖

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/50487.html

相關(guān)文章

前端每日實(shí)戰(zhàn)：163# 視頻演示如何用原生 JS 創(chuàng)作一個(gè)多選一場(chǎng)景的交互游戲（內(nèi)含 3 個(gè)視頻）

摘要：本項(xiàng)目將設(shè)計(jì)一個(gè)多選一的交互場(chǎng)景，用進(jìn)行頁面布局用制作動(dòng)畫效果用原生編寫程序邏輯。中包含個(gè)展示頭像的和個(gè)標(biāo)明當(dāng)前被選中頭像的。 showImg(https://segmentfault.com/img/bVbknOW?w=400&h=302); 效果預(yù)覽按下右側(cè)的點(diǎn)擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點(diǎn)擊鏈接可以全屏預(yù)覽。 https://codepen.io/comehope/pen/L...

pakolagij 2019-08-23 13:49 評(píng)論0 收藏0
前端每日實(shí)戰(zhàn)：163# 視頻演示如何用原生 JS 創(chuàng)作一個(gè)多選一場(chǎng)景的交互游戲（內(nèi)含 3 個(gè)視頻）

摘要：本項(xiàng)目將設(shè)計(jì)一個(gè)多選一的交互場(chǎng)景，用進(jìn)行頁面布局用制作動(dòng)畫效果用原生編寫程序邏輯。中包含個(gè)展示頭像的和個(gè)標(biāo)明當(dāng)前被選中頭像的。 showImg(https://segmentfault.com/img/bVbknOW?w=400&h=302); 效果預(yù)覽按下右側(cè)的點(diǎn)擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點(diǎn)擊鏈接可以全屏預(yù)覽。 https://codepen.io/comehope/pen/L...

antz 2019-08-02 12:09 評(píng)論0 收藏0
前端每日實(shí)戰(zhàn)：163# 視頻演示如何用原生 JS 創(chuàng)作一個(gè)多選一場(chǎng)景的交互游戲（內(nèi)含 3 個(gè)視頻）

摘要：本項(xiàng)目將設(shè)計(jì)一個(gè)多選一的交互場(chǎng)景，用進(jìn)行頁面布局用制作動(dòng)畫效果用原生編寫程序邏輯。中包含個(gè)展示頭像的和個(gè)標(biāo)明當(dāng)前被選中頭像的。 showImg(https://segmentfault.com/img/bVbknOW?w=400&h=302); 效果預(yù)覽按下右側(cè)的點(diǎn)擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點(diǎn)擊鏈接可以全屏預(yù)覽。 https://codepen.io/comehope/pen/L...

The question 2019-08-29 17:26 評(píng)論0 收藏0
前端每日實(shí)戰(zhàn)：47# 視頻演示如何用純 CSS 創(chuàng)作一個(gè)蝴蝶標(biāo)本展示框

摘要：效果預(yù)覽按下右側(cè)的點(diǎn)擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點(diǎn)擊鏈接可以全屏預(yù)覽。可交互視頻教程此視頻是可以交互的，你可以隨時(shí)暫停視頻，編輯視頻中的代碼。 showImg(https://segmentfault.com/img/bVbb5Tn?w=500&h=500); 效果預(yù)覽按下右側(cè)的點(diǎn)擊預(yù)覽按鈕可以在當(dāng)前頁面預(yù)覽，點(diǎn)擊鏈接可以全屏預(yù)覽。 https://codepen.io/comeh...

JasinYip 2019-08-29 15:39 評(píng)論0 收藏0