HTML 基本架構 & 語法

由 <html> 與 </html> 標籤來告知瀏覽器文檔的起始點和結束點。

文檔的頭部由 <head> 標籤定義，主體則是 <body> 定義。

一個簡單但完整的範例如下:

<!DOCTYPE html>
<html lang="zh">
    <head>
        <title>頁面標題</title>
    </head>
    <body>
        <p>這是一個簡單的 HTML 範本</p>
    </body>
</html>

如你所見，<html> 元素包圍住文件其餘的部分，<body> 元素則包圍住頁面內容。

這種結構可以想像成樹狀結構，這個階層的結構被稱為 DOM ( 文件物件模型 )。

標籤

大多 HTML 元素都需同時使用開始與結束標籤，你必須維持開始與結束標籤的正確巢狀結構。

有效的範例

<em>這是一個<strong>有效</strong>的範例</em>

無效的範例

<em>這是一個<strong>無效</em>的範例</strong>

某些元素不包含任何文本內容或其他元素。不需要結束標籤。

<!-- 換行 --><br>

在 XHTML 模式中這些無內容元素會以斜線表示結束

<!-- 換行 --><br />

有些開發者會認為 <br /> 的寫法是更正確些，事實上這些無內容標籤裡的 / 其實是一個被容忍的語法錯誤，基於兼容性考慮使得瀏覽器和解析都把 <br> 和 <br /> 視為同等。

Google 代碼風格指南也明確規定了不要關閉無內容標籤。

常用的標籤

Element 用途
<head> 定義文檔頭部，可包含<base>, <link>, <meat>, <style>, <title>
<hr> 水平分隔線
<body> 定義文檔主體
<a> 定義超連結
<br> 換行符
<button> 定義按鈕
<div> 區塊元素
<em> 定義為強調的內容，不建議使用 <i>
<strong> 定義為更強調的內容，不建議使用 <b>
<p> 段落元素
<label> 定義標記
<span> 行內元素
<input> 定義輸入框
<form> 定義表單
<table> 定義表格
<ul> 定義無序列表
<ol> 定義有序列表
<dl> 定義列表

results matching ""

    No results matching ""