html在線編輯器元素和語法

以下是html在線編輯器元素和語法，一篇簡單的 HTML 文章示例，用於介紹 HTML 元素和語法：

<!DOCTYPE html>
<html>
  <head>
    <title>我的第一篇文章</title>
    <meta charset="UTF-8">
    <meta name="description" content="這是一篇介紹 HTML 的文章">
    <meta name="author" content="Alice">
    <style>
      body {
        font-family: Arial, sans-serif;
      }
      h1 {
        color: navy;
        font-size: 32px;
      }
      p {
        color: black;
        font-size: 18px;
      }
    </style>
  </head>
  <body>
    <h1>HTML 元素和語法</h1>
    <p>HTML，全稱為超文本標記語言（HyperText Markup Language），是一種用於創建網頁的標準語言。</p>
    <p>HTML 使用標記（tag）來指示網頁中文本和圖像的顯示方式、鏈接和 multimedia 元素的嵌入。</p>
    <p>以下是一些常見的 HTML 元素和標記：</p>
    <ul>
      <li>&lt;p&gt;: 表示段落。</li>
      <li>&lt;a&gt;: 表示鏈接。</li>
      <li>&lt;img&gt;: 顯示圖片。</li>
      <li>&lt;ul&gt; / &lt;ol&gt; / &lt;li&gt;: 表示無序列表和有序列表。</li>
      <li>&lt;div&gt; / &lt;span&gt;: 表示文檔的區塊或段落，沒有具體的含義。</li>
      <li>&lt;br&gt;: 表示換行。</li>
    </ul>
    <p>上面的 CSS 樣式定義了文章中標題和正文的樣式。</p>
  </body>
</html>

上面的代碼包含了以下 HTML 元素和屬性：

- `<!DOCTYPE html>`: 聲明 HTML 文檔遵循的標準。

- `<html>`: HTML 文檔的根元素。

- `<head>`: 包含了關於 HTML 文檔的元數據，如 title、style 和 meta 等標簽。

  - `<title>`: 定義了在瀏覽器標簽欄上顯示的文本。

  - `<meta>`: 元標記，用於描述文檔的元數據，如字符集、網頁描述、作者等。

  - `<style>`: 定義了用於修飾 HTML 文檔的樣式表。

- `<body>`: 包含了 HTML 文檔的主要內容。

  - `<h1>`: 表示一級標題。

  - `<p>`: 表示一個段落。

  - `<ul>` / `<ol>` / `<li>`: 分別表示無序列表和有序列表。

  - `<div>` / `<span>`: 分別表示文檔的區塊或段落，沒有具體的含義。

  - `<br>`: 表示換行。

- `<a>`: 定義鏈接。

- `<img>`: 顯示圖片。

- CSS 樣式: 用於美化文檔的樣式表。其中，`font-family` 定義了文本字體，`color` 定義了文本顏色，`font-size` 定義了文本字體大小。