1-2. HTML <標籤> 有哪些?(小字典)
HTML 是什麼?
超文本標記語言(HyperText Markup Language)簡稱:HTML,HTML元素是構建網站的基石元素,由 W3C 定義和維護。
HTML 檔案的基本架構
加強認識 HTML <標籤>語法格式
頭尾包含式標籤
<body> | ........ | </body> | 網頁內容框 |
<h1> | ........ | </h1> | 標題1的框架 (h1~h6) |
<p> | ........ | </p> | 段落文字內容的框架 |
<a> | ........ | </a> | 有連結的範圍 |
<div> | ........ | </div> | 一個"區塊框架" |
無結尾單行式標籤
<meta> | 檔頭資訊宣告設定 |
<img> | 插入影像(圖片) |
<br> | 換行不換段 |
<hr> | 分隔線 |
框架類標籤
NO | 標籤 | 說明 | HTML5 | 英文參考網 | 簡中參考網 |
---|---|---|---|---|---|
1 | <header> | 定義網頁頁首的區域。 | V | w3schools | runoob |
2 | <footer> | 定義網頁頁尾的區域。 | V | w3schools | runoob |
3 | <main> | 定義網頁主要內容區域。 | V | w3schools | runoob |
4 | <nav> | 定義網頁導覽區域。 | V | w3schools | runoob |
5 | <section> | 定義一個區段範圍。 | V | w3schools | runoob |
6 | <aside> | 定義一個側邊區域範圍。 | V | w3schools | runoob |
7 | <article> | 定義文章。 | V | w3schools | runoob |
8 | <figure> | 定義圖形影像的區塊。 | V | w3schools | runoob |
9 | <figcaption> | 定義 figure 的標題。 | V | w3schools | runoob |
10 | <div> | 單純是一個框。 | w3schools | runoob | |
11 | <h1> ~ <h6> | 標題1、標題2、標題3、標題4、標題5、標題6。 | w3schools | runoob | |
12 | <p> | 一個段落框。 | w3schools | runoob | |
13 | <ul> | 無序號的清單框架。 | w3schools | runoob | |
14 | <ol> | 有序號的清單框架。 | w3schools | runoob | |
15 | <li> | 清單框架中的一個清單項目。 | w3schools | runoob |
文中局部區域類標籤
NO | 標籤 | 說明 | HTML5 | 英文參考網 | 簡中參考網 |
---|---|---|---|---|---|
1 | <a> | 定義連結的區域。 | w3schools | runoob | |
2 | <span> | 局部文字區域。 | w3schools | runoob | |
3 | <small> | 定義局部小型文字區域。 | w3schools | runoob | |
4 | <strong> | 定義局部區域文字粗體,<b>也是表現粗體。 | w3schools | runoob | |
5 | <em> | 定義局部區域文字斜體,<i>也是表現斜體。 | w3schools | runoob | |
6 | <mark> | 內容文字亮底呈現。 | V | w3schools | runoob |
7 | <img> | 定義一個影像。 | w3schools | runoob | |
8 | <iframe> | 定義一個內置框架,框架內連結顯示指定的網頁。 | w3schools | runoob | |
9 | <button> | 定義一個按鈕。 | w3schools | runoob |
功能類標籤
NO | 標籤 | 說明 | HTML5 | 英文參考網 | 簡中參考網 |
---|---|---|---|---|---|
1 | <!-- --> | HTML語言中的註解。 | w3schools | runoob | |
2 | <br> | 分行不分段 ( 表示一個區塊中或段落文字中強迫分行 )。 | w3schools | runoob | |
3 | <hr> | 分隔線。 | w3schools | runoob | |
4 | <a> | 定義連結的區域。 | w3schools | runoob | |
5 | <img> | 定義顯示一個影像。 | w3schools | runoob | |
6 | <iframe> | 定義一個內置框架,框架內連結顯示指定的網頁。 | w3schools | runoob | |
7 | <button> | 定義一個按鈕。 | w3schools | runoob | |
8 | <progress> | 定義顯示進度條。 | V | w3schools | runoob |
9 | <canvas> | 定義一個畫布區域,這個區域由 JS 程式來設計與控制。 | V | w3schools | runoob |
10 | <svg> | 是可縮放的向量圖形 ( Scalable Vector Graphics ) 的縮寫。 可直接以 <img> 插圖顯示,也可以運用 svg 的原始碼再配合 JS 程式設計與控制。 |
V | w3schools | runoob |
表格類標籤
NO | 標籤 | 說明 | HTML5 | 英文參考網 | 簡中參考網 |
---|---|---|---|---|---|
1 | <table> | 定義為一個表格。 | w3schools | runoob | |
2 | <tr> | 定義表格中的一個橫列。 | w3schools | runoob | |
3 | <th> | 定義表格中的標題儲存格(預設文字粗體置中)。 | w3schools | runoob | |
4 | <td> | 定義表格中的一般儲存格。 | w3schools | runoob | |
5 | <thead> | 定義表格中的首區。 | w3schools | runoob | |
6 | <tbody> | 定義表格中的內容區。 | w3schools | runoob | |
7 | <tfoot> | 定義表格中的尾區。 | w3schools | runoob |
表單類標籤
NO | 標籤 | 說明 | HTML5 | 英文參考網 | 簡中參考網 |
---|---|---|---|---|---|
1 | <form> | 定義一個表單的區域。 | w3schools | runoob | |
2 | <input> | 表單中的輸入欄位、選項欄位、表單按鈕(由 type 屬性來決定)。 | w3schools | runoob | |
3 | <textarea> | 表單中輸入可以換行的段落文字區域。 | w3schools | runoob | |
4 | <select> | 表單中定義下拉式選單的區域。 | w3schools | runoob | |
5 | <option> | <select> 中定義下拉式選單的一個選項。 | w3schools | runoob | |
6 | <datalist> | 定義可輸入過濾項目的下拉式選單。 | V | w3schools | runoob |
7 | <label> | 定義與表單欄位相關連的區域。 | w3schools | runoob |
影音類標籤