HTML 目前版本
HTML5 是當前網頁開發的標準,提供了許多新元素和屬性來簡化開發並增強網頁功能。以下是 HTML5 語法的總整理,幫助您快速了解並應用這些新特性。
想了解 HTML 相關資訊,可以看看這兩篇:
基本語法
DOCTYPE
在 HTML5 中,DOCTYPE
宣告已被簡化,只需使用以下語法:
<!DOCTYPE html>
字符編碼
在 HTML5 中,設定字符編碼的語法也被簡化:
<meta charset="UTF-8">
Script 和 Link 標籤
HTML5 中的 <script>
和 <link>
標籤不再需要 type
屬性:
<script src="scriptfile.js"></script>
<link rel="stylesheet" href="stylefile.css">
新增的 HTML5 元素
HTML5 引入了許多新元素來提高網頁語義性和功能性。例如:
類型 | 元素 | 描述 |
---|---|---|
文章和段落標記 | <article> , <section> , <nav> , <aside> , <header> , <footer> | 提高網頁的語義性 |
媒體元素 | <audio> , <video> , <source> , <track> | 用於音頻和視頻內容 |
圖形元素 | <canvas> , <svg> | 支持繪圖和圖形渲染 |
表單元素 | <datalist> , <output> , <progress> , <meter> | 提升表單的功能性 |
互動元素 | <details> , <summary> | 增加互動性元素 |
如果你想知道網頁製作最常使用的語意標籤有哪些,可以看看以下這篇
全域屬性
HTML5 引入了多個全域屬性,這些屬性可以應用於所有 HTML 元素:
屬性 | 描述 |
---|---|
id | 元素的唯一標識符 |
class | 元素的類名 |
style | 內聯樣式 |
data-* | 自定義數據屬性 |
hidden | 隱藏元素 (Tutorialspoint) (Wikipedia) |
表單改進
HTML5 為表單新增了多種類型的輸入控件和屬性:
輸入類型 | 描述 |
---|---|
email | 電子郵件地址 |
url | 網址 |
number | 數字 |
range | 範圍滑塊 |
date | 日期 |
datetime-local | 當地日期和時間 |
color | 顏色選擇器 |
required | 確保用戶填寫必填字段 |
placeholder | 提供提示文本 (Wikipedia) (MDN Web Docs) |
廢棄/替代的元素標籤
HTML5 移除了許多過時的元素,這些元素已被新的、更語義化的標籤所取代:
元素 | 描述 | 狀態 | 替代標籤 |
---|---|---|---|
<acronym> | 縮略詞 | 廢棄 | <abbr> |
<applet> | Java applet | 廢棄 | <object> |
<basefont> | 基本字體 | 廢棄 | CSS |
<big> | 大號字體 | 廢棄 | CSS |
<center> | 中心對齊 | 廢棄 | CSS |
<dir> | 目錄列表 | 廢棄 | <ul> |
<font> | 字體設置 | 廢棄 | CSS |
<frame> | 框架 | 廢棄 | – |
<frameset> | 框架集 | 廢棄 | – |
<noframes> | 不支持框架的內容 | 廢棄 | – |
<strike> | 刪除線文本 | 廢棄 | <s> |
<tt> | 打字機文本 | 廢棄 | CSS |
HTML5 標籤總整理表 (A-Z)
最後幫你整理出一份包含 HTML5 標籤的完整列表,按字母順序排列,每個標籤都附有簡短的說明和狀態,方便開發RD查閱。
這是一份包含 HTML5 標籤的完整列表,按字母順序排列,每個標籤都附有簡短的說明和狀態。
標籤 | 說明 | 狀態 |
---|---|---|
<!– –> | 註解 | 可用 |
<a> | 超連結、錨點 | 可用 |
<abbr> | 縮寫 | 可用 |
<address> | 聯絡信息標籤 | 可用 |
<area> | 圖像映射區域標籤 | 可用 |
<article> | 文章標籤,用於自包含的內容 | 可用 |
<aside> | 側邊欄標籤,表示非主要內容 | 可用 |
<audio> | 音頻內容標籤 | 可用 |
<b> | 粗體字標籤 | 可用 |
<base> | 指定網頁連結 | 可用 |
<bdi> | 雙向隔離文本 | 可用 |
<bdo> | 文字方向覆寫 | 可用 |
<blockquote> | 塊引用 | 可用 |
<body> | 網頁主體標籤 | 可用 |
<br> | 換行標籤 | 可用 |
<button> | 按鈕標籤 | 可用 |
<canvas> | 畫布標籤,用於繪製圖形 | 可用 |
<caption> | 表格標題 | 可用 |
<cite> | 引用標籤 | 可用 |
<code> | 程式碼標籤 | 可用 |
<col> | 表格列標籤 | 可用 |
<colgroup> | 表格列群組標籤 | 可用 |
<data> | 錨數據 | 可用 |
<datalist> | 預定義選項列表 | 可用 |
<dd> | 定義描述標籤 | 可用 |
<del> | 刪除文本標籤 | 可用 |
<details> | 詳情標籤,用於可展開的詳細內容 | 可用 |
<dfn> | 定義標籤 | 可用 |
<dialog> | 對話框標籤 | 可用 |
<div> | 分區或區段標籤 | 可用 |
<dl> | 定義列表標籤 | 可用 |
<dt> | 定義項目標籤 | 可用 |
<em> | 強調標籤 | 可用 |
<embed> | 嵌入外部內容標籤 | 可用 |
<fieldset> | 表單字段集 | 可用 |
<figcaption> | 圖例標題 | 可用 |
<figure> | 圖例標籤 | 可用 |
<footer> | 頁腳標籤 | 可用 |
<form> | 表單標籤 | 可用 |
<h1> | 標題 1 | 可用 |
<h2> | 標題 2 | 可用 |
<h3> | 標題 3 | 可用 |
<h4> | 標題 4 | 可用 |
<h5> | 標題 5 | 可用 |
<h6> | 標題 6 | 可用 |
<head> | 頁首標籤 | 可用 |
<header> | 頁眉標籤 | 可用 |
<hgroup> | 標題群組標籤 | 可用 |
<hr> | 水平線標籤 | 可用 |
<html> | 根元素標籤 | 可用 |
<i> | 斜體字標籤 | 可用 |
<iframe> | 嵌入框架 | 可用 |
<img> | 圖像標籤 | 可用 |
<input> | 輸入控件標籤 | 可用 |
<ins> | 插入文本標籤 | 可用 |
<kbd> | 鍵盤輸入標籤 | 可用 |
<label> | 表單標籤 | 可用 |
<legend> | 表單說明 | 可用 |
<li> | 列表項標籤 | 可用 |
<link> | 鏈接標籤 | 可用 |
<main> | 主內容標籤 | 可用 |
<map> | 圖像映射標籤 | 可用 |
<mark> | 標記文本標籤 | 可用 |
<menu> | 菜單列表標籤 | 可用 |
<meta> | 元數據標籤 | 可用 |
<meter> | 測量值標籤 | 可用 |
<nav> | 導航鏈接標籤 | 可用 |
<noscript> | 不支持腳本 | 可用 |
<object> | 插入對象標籤 | 可用 |
<ol> | 有序列表標籤 | 可用 |
<optgroup> | 選項組標籤 | 可用 |
<option> | 選項標籤 | 可用 |
<output> | 輸出標籤 | 可用 |
<p> | 段落標籤 | 可用 |
<param> | 參數標籤 | 可用 |
<picture> | 圖像元素 | 可用 |
<pre> | 預格式化文本 | 可用 |
<progress> | 進度條標籤 | 可用 |
<q> | 短引用標籤 | 可用 |
<rp> | Ruby 避免標籤 | 可用 |
<rt> | Ruby 文本標籤 | 可用 |
<ruby> | Ruby 註釋標籤 | 可用 |
<s> | 刪除線標籤 | 可用 |
<samp> | 範例輸出標籤 | 可用 |
<script> | 腳本標籤 | 可用 |
<section> | 區段標籤 | 可用 |
<select> | 選擇控件標籤 | 可用 |
<small> | 小字標籤 | 可用 |
<source> | 媒體資源標籤 | 可用 |
<span> | 範圍標籤 | 可用 |
<strong> | 強調標籤 | 可用 |
<style> | 樣式標籤 | 可用 |
<sub> | 下標標籤 | 可用 |
<summary> | 詳情摘要 | 可用 |
<sup> | 上標標籤 | 可用 |
<table> | 表格標籤 | 可用 |
<tbody> | 表格主體 | 可用 |
<td> | 表格單元格 | 可用 |
<template> | 模板標籤 | 可用 |
<textarea> | 多行文本輸入 | 可用 |
<tfoot> | 表格表尾 | 可用 |
<th> | 表格頭部單元格 | 可用 |
<thead> | 表格頭部 | 可用 |
<time> | 時間標籤 | 可用 |
<title> | 標題標籤 | 可用 |
<tr> | 表格行 | 可用 |
<track> | 媒體字幕標籤 | 可用 |
<u> | 下劃線標籤 | 可用 |
<ul> | 無序列表標籤 | 可用 |
<var> | 變量標籤 | 可用 |
<video> | 視頻標籤 | 可用 |
<wbr> | 強制換行標籤 | 可用 |
發表迴響