什麼是 HTML?
HTML 代表 Hyper Text Markup Language(超文字標記語言)
HTML 是網頁的標準標記語言
HTML 元素是 HTML 頁面的構建塊
HTML 元素由<> 標籤表示
HTML 元素
HTML 元素由一個開始標籤和一個結束標籤以及它們之間的內容組成
<h1>這是一個標題</h1>
開始標籤 | 元素內容 | 結束標籤 |
---|---|---|
<h1> | 這是一個標題 | </h1> |
<p> | 這是段落。 | </p> |
HTML 屬性
- HTML 元素可以具有屬性
- 屬性提供有關元素的額外資訊
- 屬性以名稱/值對的形式出現,例如charset="utf-8"
一個簡單的 HTML 文件
<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">
<title>頁面標題</title>
<body>
<h1>這是一個標題</h1>
<p>這是一個段落。</p>
<p>這是另一個段落。</p>
</body>
</html>
示例解釋
HTML 元素是 HTML 頁面的構建塊。
- <!DOCTYPE html> 宣告將此文件定義為 HTML5
<html>
元素是HTML頁面的根元素lang
屬性定義了文件的語言- <meta> 元素包含關於文件的元資訊
charset
屬性定義了文件中使用的字元集- <title> 元素為文件指定一個標題
- <body> 元素包含可見的頁面內容
<h1>
元素定義一個大標題<p>
元素定義一個段落
HTML 文件
所有 HTML 文件都必須以文件型別宣告開始: <!DOCTYPE html>。
HTML 文件本身以 <html> 開始,以 </html> 結束。
HTML 文件的可視部分位於 <body> 和 </body> 之間。
HTML 文件結構
下面是一個 HTML 文件(一個 HTML 頁面)的視覺化表示
注意:只有 <body> 部分內的內容(上面的白色區域)才會在瀏覽器中顯示。
HTML 標題
HTML 標題使用 <h1> 到 <h6> 標籤定義。
<h1> 定義最重要的標題。 <h6> 定義最不重要的標題:
HTML 段落
HTML 段落使用 <p> 標籤定義
HTML 連結
HTML 連結使用 <a> 標籤定義
連結的地址在 href 屬性中指定。
HTML 影像
HTML 影像使用 <img> 標籤定義。
原始檔 (src)、替代文字 (alt)、寬度 (width) 和高度 (height) 作為屬性提供
HTML 按鈕
HTML 按鈕使用 <button> 標籤定義
HTML 列表
HTML 列表使用 <ul>(無序/專案符號列表)或 <ol>(有序/編號列表)標籤定義,後跟 <li> 標籤(列表項)
HTML 表格
HTML 表格使用 <table> 標籤定義。
表格行使用 <tr> 標籤定義。
表格標題使用 <th> 標籤定義。(預設粗體居中)。
表格單元格(資料)使用 <td> 標籤定義。
示例
<table>
<tr>
<th>名字</th>
<th>姓氏</th>
<th>年齡</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
自己動手 » 使用 CSS »程式設計 HTML
每個 HTML 元素都可以有屬性。
對於 Web 開發和程式設計,最重要的屬性是id 和 class。這些屬性通常用於處理基於程式的網頁操作。
Attribute | 示例 |
---|---|
id | <table id="table01" |
類別 | <p class="normal"> |
樣式 | <p style="font-size:16px"> |
data- | <div data-id="500"> |
onclick | <input onclick="myFunction()"> |
onmouseover | <a onmouseover="this.setAttribute('style','color:red')"> |
完整的 HTML 教程
以上是對 HTML 的簡短描述。
如需完整的 HTML 教程,請訪問 W3Schools HTML 教程。
如需完整的 HTML 標籤參考,請訪問 W3Schools 標籤參考。