HTML-便签、元素、属性

什么是 HTML？

HTML 是用来描述网页的一种语言。

• HTML 指的是超文本标记语言 (Hyper Text Markup Language)
• HTML 不是一种编程语言，而是一种标记语言 (markup language)
• 标记语言是一套标记标签 (markup tag)
• HTML 使用标记标签来描述网页

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

• HTML 标签是由尖括号包围的关键词，比如
• HTML 标签通常是成对出现的，比如 和
• 标签对中的第一个标签是开始标签，第二个标签是结束标签
• 开始和结束标签也被称为开放标签和闭合标签

---

基本的 HTML 标签

HTML 标题

HTML 标题（Heading）是通过 <h1> - <h6> 等标签进行定义的。
<h1> 定义最大的标题。<h6> 定义最小的标题

实例：

    <h1>This is a heading</h1>
    <h2>This is a heading</h2>
    <h3>This is a heading</h3>

HTML 段落

HTML 段落是通过 <p> 标签进行定义的。

实例：

    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>

---

HTML 链接

HTML 链接是通过 <a> 标签进行定义的

实例：

    <a href="/index.html">本文本</a> 是一个指向本网站中的一个页面的链接。</p>

    <p><a href="http://www.microsoft.com/">本文本</a> 是一个指向万维网上的页面的链接。</p>

注释：在 href 属性中指定链接的地址。

---

HTML 图像

图像标签（）和源属性（Src）,src 指 “source”。

HTML 图像是通过 <img> 标签进行定义的。

实例：

<img src="w3school.jpg" width="104" height="142" />

---

HTML 折行

换行（新行），请使用 <br /> 标签

实例：

    <p>This is<br />a para<br />graph with line breaks</p>

---

HTML 无序列表

无序列表
无序列表始于 <ul> 标签。每个列表项始于 <li>。

实例：

    <ul>
      <li>咖啡</li>
      <li>茶</li>
      <li>牛奶</li>
    </ul>

---

HTML 无序列表

有序列表
有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。

实例：

    <ol>
      <li>咖啡</li>
      <li>牛奶</li>
      <li>茶</li>
    </ol>

---

HTML 布局

使用 <div> 元素添加布局。
div 元素是用于分组 HTML 元素的块级元素。

实例：

    <div id="div">  </div>

---

HTML 表单和输入

输入标签（<input>）

实例：

    <input type="text" name="name" />

---

HTML 按钮（Button）

实例：

    <button> Hello world </button>
    <input type="button" value="Hello world!">

---

HTML 单选按钮（Radio Buttons）

实例：

    <input type="radio" name="sex" value="male" /> Male
    <br />
    <input type="radio" name="sex" value="female" /> Female

---

HTML 复选框（Checkboxes）

实例：

    <input type="checkbox" name="bike" /> I have a bike
    <br />
    <input type="checkbox" name="car" /> I have a car

---

HTML 元素

HTML 元素指的是从开始标签（start tag）到结束标签（end tag）的所有代码。

HTML 元素语法

• HTML 元素以开始标签起始
• HTML 元素以结束标签终止
• 元素的内容是开始标签与结束标签之间的内容
• 某些 HTML 元素具有空内容（empty content）
• 空元素在开始标签中进行关闭（以开始标签的结束而结束）
• 大多数 HTML 元素可拥有属性
• 嵌套的 HTML 元素（可以包含其他 HTML 元素）

---

HTML 属性

• HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多的信息。
• 属性总是以名称/值对的形式出现，比如：name=”value”。
• 属性总是在 HTML 元素的开始标签中规定。