iT邦幫忙

鐵人檔案

2019 iT 邦幫忙鐵人賽
回列表
自我挑戰組

如何架出github.io的個人網頁-html的30天自由式筆記 系列

先前誤打誤撞、瞎子摸象,四處在教學網找尋,或從其他網頁的原始碼,嘗試理解自己想使用的功能如何運作;但是苦於一些詭異的初學者糾結,在教學網直接複製出錯誤、而別人的網頁原始碼太大串,苦苦尋不著門路。
因此於這次鐵人賽嘗試用30日連更,寫出當時使用github.io架設個人網頁時,所遭遇的迷惘。從無到有,一步一步地讓其他生手無痛進入自學階段;而我同樣身為學習者,在寫完曾經的錯路之後,亦會找到什麼操作就寫上什麼教學。

鐵人鍊成 | 共 30 篇文章 | 13 人訂閱 訂閱系列文 RSS系列文
DAY 11

暖身活動:來惡搞Google(上)

將來的你可能會想藉由別人的網頁,參考學習各個網頁中元素的使用方式,快快獲得EXP、迅速升等成為大大,彷彿開掛偷用金手指。 但是一打開落落長的原始碼,才發現自己在...

2018-10-26 ‧ 由 IrisAndMimi 分享
DAY 12

暖身活動:來惡搞Google(下)

假設你想要知道Google搜尋的按鈕,只求它那一段的原始碼,可以在它的位置上點擊右鍵,選擇檢測元素,並不需要檢測原始碼自虐。 這時候是不是看見兩個地方跟它的...

2018-10-27 ‧ 由 IrisAndMimi 分享
DAY 13

自學第一階:給你快速升級的門路

在Day11和Day12的時候,我們做了一些有趣的惡整: 藉由隨意嘗試和修改,是一種輕鬆卻還很初階的探索學習。 雖然按照這樣的方式繼續學習會很快樂,但若是急著完...

2018-10-28 ‧ 由 IrisAndMimi 分享
DAY 14

如果你沒將github.io取在Repository的尾端?(照官方命名版)

我們在Day3的尾端介紹了Repository的取名規則。 如果你們還記得的話,除了正規按照官方要求的命名方式,另一種則是完全的隨便取名。 我認識了一部份的人,...

2018-10-29 ‧ 由 IrisAndMimi 分享
DAY 15

如果你沒將github.io取在Repository的尾端?(隨意命名版)

接下來這個,是用戶沒把github.io取在Repository尾端的例子: 而這位黑魔法師的主頁網址是這副模樣: 發現有什麼不同之處嗎? 網址後面多了一...

2018-10-30 ‧ 由 IrisAndMimi 分享
DAY 16

除了主頁之外,我想開其他分頁,該怎麼辦?

由於前一篇提到了和子資料夾衝突的問題,我們必須談談檔案路徑。 沒想到這樣雞毛蒜皮的問題,曾經也讓菜鳥時期的我苦惱很久。 首先index.html是瀏覽一個網...

2018-10-31 ‧ 由 IrisAndMimi 分享
DAY 17

如何切換到另一個頁面?

之後,若你想從一個頁面連接到其他頁面…… 可以選擇 超連結 的語法: <a href="要連結的URL" target="用...

2018-11-01 ‧ 由 IrisAndMimi 分享
DAY 18

URL究竟是什麼?網址嗎?

在前一篇的超連結的語法,我們看見了href屬性。 之後,這個href屬性,將會經常活躍於你的程式碼中~ 它的功能是用於指定超鏈接目標的URL。 如果觀察大多網...

2018-11-02 ‧ 由 IrisAndMimi 分享
DAY 19

檔案路徑的絕對與相對?

就像地圖有絕對座標和相對座標~ 如果你不想以網址決定檔案的位置,要從自己所在的網頁位址當作基準點,指出檔案的方向,這也能辦到! 推薦閱讀:絕對路徑和相對路徑...

2018-11-03 ‧ 由 IrisAndMimi 分享
DAY 20

斜槓與反斜槓

這是接續了前一篇推薦的教學網址,對其談到的斜槓稍作內容延伸。 這個符號 「/」就是斜槓,呈現上右下左。 而 「\」是反斜槓,呈現上左下右。 斜線的方向,有時...

2018-11-04 ‧ 由 IrisAndMimi 分享