我將帶你認識HTML,並使用HTML打造第一個網頁。
三個步驟使用HTML建立自己的第一個網頁
HTML是什麼?
在建立網頁之前,還是要向大家介紹一下HTML。 HTML全名為HyperText Markup Language(超文本標記語言),主要是用來建立網站內容及網站架構的標準語言。
簡單來說,HTML是建立網站的基本,瀏覽器會根據HTML內的標籤來呈現相對應的內容。 那就廢話不多說,馬上開始我們的三個步驟。
我們會在下次介紹標籤是什麼,以及常用的標籤有哪些
第一步:建立一個資料夾
首先,建立一個名為project的資料夾來存放我們之後撰寫的檔案。
接著,開啟我們的IDE(Visual Studio Code)並點擊左側的「Open Folder」並選擇剛剛建立好的資料夾路徑。
還不知道IDE的朋友可以先閱讀上一篇 。
第二步:建立index.html
打開IDE後讓我們先建立一個Index.html的檔案。有兩種方式可以建立:
- 左上方File > New File
- 滑鼠左鍵對著內容點兩下
之後你會看到一個新的File被建立出來
接著你可以在上面寫一些內容,比如:My First Website。寫完後將其存檔至剛剛建立的project資料夾,並將檔案命名為index.html。
這邊副檔名為.html,其目的是為了讓瀏覽器知道這是html檔,以供瀏覽器閱讀。
為什麼要命名為index.html?
index為索引的意思,顧名思義index.html被公認為網頁的入口/首頁。當你今天沒有特別指定要到哪個頁面時,就會進到index.html頁面。
第三步:透過瀏覽器開啟index.html
你可以透過瀏覽器打開index.html。若有看到My First Website的話。
恭喜你,你已經完成了你的第一個網頁。
總結
你可能覺得目前這個網頁好單調,只能顯示文字一點都不漂亮。 先不要著急,後續我會教你如何透過標籤(Element)讓畫面更加美觀。