HTML是什麼？HTML基礎與解說

HTML簡介

HTML（HyperText Markup Language，超文本標記語言）是一種用於建立網頁內容並將其呈現在網絡瀏覽器上的標準標記語言。這種語言讓我們能夠創建和格式化網頁上的各種內容，包括文本、圖像、視頻、以及超鏈接，這些鏈接可以引導你到其他網頁或者網站。

HTML 文件是由一系列的標籤（tags）組成，這些標籤描述了網頁上各元素的意義和屬性。例如，

到

的標籤用來標記六種大小的標題，

標籤用來標記段落， 標籤創建超鏈接，而 標籤則用來插入圖片。

HTML 是建立網頁的基礎，瀏覽器讀取 HTML 文件，並將其渲染成可視或可聽的網頁。為了讓網頁更具吸引力，開發人員通常還會使用 CSS（Cascading Style Sheets，層疊樣式表）來添加風格和布局，以及使用 JavaScript 來添加互動性。

HTML 的功能是什麼？

HTML (超文本標記語言) 是網頁設計的基礎，主要的功能如下：

• 結構化內容：HTML 使用不同的標籤來描述和組織網頁內容，例如標題 (h1 到 h6)，段落 (p)，列表 (ul, ol)，表格 (table)，等等。
• 呈現媒體內容：HTML 提供了專門用來插入圖像 (img)，音頻 (audio)，視頻 (video) 等多媒體內容的標籤。
• 建立超連結：HTML 使用超連結 (a) 來引導使用者到達其他的網頁或網站，或者網頁內的不同部分。
• 表單功能：HTML 提供了用於收集用戶輸入的表單元素，如輸入框 (input)，選擇框 (select)，按鈕 (button)，等等。
• 與 CSS 和 JavaScript 互動：HTML 可以與 CSS 和 JavaScript 結合，實現複雜的版面設計和互動功能。CSS 用來控制網頁的外觀和風格，而 JavaScript 則是用來實現網頁的互動功能。

總的來說，HTML 是網頁設計的基礎，提供了網頁內容結構的描述和媒體內容的呈現，並且與 CSS 和 JavaScript 結合，可以建立出功能豐富的網頁和應用程式。

編寫基本的HTML

開始編寫 HTML 很簡單，你只需要一個簡單的文本編輯器（如 Notepad、Sublime Text、Visual Studio Code等）就可以開始。

線上即時 HTML 編輯器，修改原始碼立即查看效果變化：https://html.cafe/

這是一個非常基礎的 HTML 文件，它的結構如下：

• ：這個宣告讓瀏覽器知道該文件是一個 HTML5 文檔。
• ：這個標籤是 HTML 頁面的根元素，所有的其他 HTML 標籤都要放在這個標籤的內部。
• ：這個區域包含了所有關於網頁的資訊，但不會在網頁上顯示出來。例如，你可以在這裡設定網頁的標題。
• ：這個區域是瀏覽者在瀏覽器中看到的部分，包括文字、圖片、連結、表格、列表等等。

• ：這是一個主標題標籤，網頁可以有多個標題，從

  到

  ，其中

  最大，

  最小。

HTML元素的基本組成部分：

• 1.起始標籤：每個HTML元素都是由一個起始標籤開始的。這個標籤是由小於符號 < 和大於符號 > 包圍的元素名稱，比如

  。這個標籤告訴瀏覽器，一個新的元素從這裡開始。

• 2.結束標籤：與起始標籤相對應，每個HTML元素都應該有一個結束標籤。這個標籤的格式與起始標籤類似，但在元素名稱前面加了一個斜線 /，比如
  。這個標籤告訴瀏覽器，該元素在這裡結束。當撰寫HTML時，不要忘記每個元素的結束標籤，否則可能會出現不可預期的結果。
• 3.內容：在起始標籤和結束標籤之間的部分就是元素的內容。對於上述的

  元素來說，內容就是一段文字。

• 4.元素：所以，一個完整的HTML元素包括了起始標籤、內容和結束標籤。

此外，HTML元素還可以包含屬性。屬性提供了關於元素的額外信息，並且可以改變元素的行為或外觀。每個屬性都在起始標籤中定義，並由屬性名和屬性值組成。例如， 中的 src 就是一個屬性，它指定了圖像的來源。

你可以將上述的代碼打入到你的文本編輯器中，然後保存為一個 .html 檔案。

在你的工作區域中，建立一個新的文件，並將其命名為 index.html。這是你網站的首頁。當你在瀏覽器中輸入你的網站地址，如果沒有指定特定的網頁，瀏覽器將自動尋找 index.html 這個文件作為首頁來顯示。

在 index.html 文件中，你可以開始寫入你的 HTML 碼。以上是一個最基本的 HTML 文件的結構：

這段 HTML 碼定義了一個非常基本的網頁，包含了一個標題和一段文字。你可以將這段 HTML 碼插入你的 index.html 文件中，然後在瀏覽器中打開這個文件來查看你的網頁。

如果你的 HTML 編輯器會自動插入這些基本的 HTML 結構，或者如果你正在使用一款所見即所得（WYSIWYG）的編輯器，則你可以跳過手動插入這段 HTML 碼的步驟。

HTML基本語法

以下是一些基本的 HTML 標籤和語法：

• ：這是 HTML5 文檔的標準聲明，告訴瀏覽器該文檔是 HTML5 文件。
• ：這是 HTML 文件的根標籤。所有的其他 HTML 標籤都應該包含在 和 之間。

  

• ：這個標籤包含了所有關於網頁的資訊，但不會在網頁上顯示出來。例如，你可以在 和 之間設定網頁的標題、描述，以及引入 CSS 和 JavaScript 文件。