关于HTML的学习

来源：互联网发布：vscode 编码方式默认编辑：程序博客网时间：2024/06/05 10:20

一、HTML简介

1. HTML的含义

HTML 是用来描述网页的一种语言。HTML 指的是超文本标记语言，HTML 不是一种编程语言，而是一种标记语言，它使用标记标签来描述网页。

2.HTM标签

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

（1）HTML 标签是由尖括号包围的关键词，比如 <html>；

（2）HTML 标签通常是成对出现的，比如 <b> 和 </b>；

（3）标签对中的第一个标签是开始标签，第二个标签是结束标签；

（4）开始和结束标签也被称为开放标签和闭合标签。

3.HTML 文档

HTML 文档描述网页,且包含 HTML 标签和纯文本，所以HTML 文档也被称为网页。

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

<html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>

例子解释

<html> 与 </html> 之间的文本描述网页
<body> 与 </body> 之间的文本是可见的页面内容
<h1> 与 </h1> 之间的文本被显示为标题
<p> 与 </p> 之间的文本被显示为段落

HTML 文档描述网页
HTML 文档包含 HTML 标签和纯文本
HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

<html><body><h1>My First Heading</h1><p>My first paragraph.</p></body></html>

例子解释

（1）<html> 与 </html> 之间的文本描述网页

（2）<body> 与 </body> 之间的文本是可见的页面内容

（3）<h1> 与 </h1> 之间的文本被显示为标题

（4）<p> 与 </p> 之间的文本被显示为段落

二、HTML编辑器

可以使用 Notepad 或 TextEdit 来编写 HTML，也可以使用专业的 HTML 编辑器来编辑 HTML：Adobe Dreamweaver、Microsoft Expression Web、CoffeeCup HTML Editor，也可以使用文本编辑器来学习 HTML，比如 Notepad (PC) 或 TextEdit (Mac)。

示例

第一步：启动记事本：开始→所有程序→附件→ 记事本

第二步：用记事本来编辑 HTML（在记事本中键入 HTML 代码）：

第三步：保存HTML

即在记事本的文件菜单选择“另存为”。保存 HTML 文件时，既可以使用 .htm 也可以使用 .html 扩展名。在一个容易记忆的文件夹中保存这个文件，比如 w3school。

第四步：在浏览器中运行HTML这个文件

启动浏览器→选择“文件”菜单的“打开文件”命令，或者直接在文件夹中双击 HTML 文件。

三、基本的HTML标签

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

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

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

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

四、HTML元素

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

开始标签（opening tag）元素内容结束标签（closing tag）<p>This is a paragraph</p><a href="default.htm" >This is a link</a><br />

HTML 元素语法：HTML 元素以开始标签起始，以结束标签终止；元素的内容是开始标签与结束标签之间的内容；某些 HTML 元素具有空内容（empty content）；空元素在开始标签中进行关闭（以开始标签的结束而结束）；大多数 HTML 元素可拥有属性。

嵌套的 HTML 元素：大多数 HTML 元素可以嵌套（可以包含其他 HTML 元素）。HTML 文档由嵌套的 HTML 元素构成。

HTML 文档实例

<html><body><p>This is my first paragraph.</p></body></html>

注释：

<p> 元素：

<p>This is my first paragraph.</p>

这个 <p> 元素定义了 HTML 文档中的一个段落。

这个元素拥有一个开始标签 <p>，以及一个结束标签 </p>。

元素内容是：This is my first paragraph。

<body> 元素：

<body><p>This is my first paragraph.</p></body>

<body> 元素定义了 HTML 文档的主体。

这个元素拥有一个开始标签 <body>，以及一个结束标签 </body>。

元素内容是另一个 HTML 元素（p 元素）。

<html> 元素：

<html><body><p>This is my first paragraph.</p></body></html>

<html> 元素定义了整个 HTML 文档。

这个元素拥有一个开始标签 <html>，以及一个结束标签 </html>。

元素内容是另一个 HTML 元素（body 元素）。

注意：

1.不要忘记结束标签；

2.在标签中加空的HTML元素（开始标签除外）

3.使用小写编写标签

五、HTML属性

HTML 标签可以拥有属性。属性提供了有关 HTML 元素的更多信息。

HTML属性参考手册

标签描述定义注释。<!DOCTYPE> 定义文档类型。<a>定义锚。<abbr>定义缩写。<acronym>定义只取首字母的缩写。<address>定义文档作者或拥有者的联系信息。<applet>不赞成使用。定义嵌入的 applet。<area>定义图像映射内部的区域。<article>定义文章。<aside>定义页面内容之外的内容。<audio>定义声音内容。<b>定义粗体字。<base>定义页面中所有链接的默认地址或默认目标。<basefont>不赞成使用。定义页面中文本的默认字体、颜色或尺寸。<bdi>定义文本的文本方向，使其脱离其周围文本的方向设置。<bdo>定义文字方向。<big>定义大号文本。<blockquote>定义长的引用。<body>定义文档的主体。<br>定义简单的折行。<button>定义按钮 (push button)。<canvas>定义图形。<caption>定义表格标题。<center>不赞成使用。定义居中文本。<cite>定义引用(citation)。<code>定义计算机代码文本。<col>定义表格中一个或多个列的属性值。<colgroup>定义表格中供格式化的列组。<command>定义命令按钮。<datalist>定义下拉列表。<dd>定义定义列表中项目的描述。<del>定义被删除文本。<details>定义元素的细节。<dir>不赞成使用。定义目录列表。<div>定义文档中的节。<dfn>定义定义项目。<dialog>定义对话框或窗口。<dl>定义定义列表。<dt>定义定义列表中的项目。<em>定义强调文本。<embed>定义外部交互内容或插件。<fieldset>定义围绕表单中元素的边框。<figcaption>定义 figure 元素的标题。<figure>定义媒介内容的分组，以及它们的标题。<font>不赞成使用。定义文字的字体、尺寸和颜色。<footer>定义 section 或 page 的页脚。<form>定义供用户输入的 HTML 表单。<frame>定义框架集的窗口或框架。<frameset>定义框架集。<h1> to <h6>定义 HTML 标题。<head>定义关于文档的信息。<header>定义 section 或 page 的页眉。<hr>定义水平线。<html>定义 HTML 文档。<i>定义斜体字。<iframe>定义内联框架。<img>定义图像。<input>定义输入控件。<ins>定义被插入文本。<isindex>不赞成使用。定义与文档相关的可搜索索引。<kbd>定义键盘文本。<keygen>定义生成密钥。<label>定义 input 元素的标注。<legend>定义 fieldset 元素的标题。<li>定义列表的项目。<link>定义文档与外部资源的关系。<map>定义图像映射。<mark>定义有记号的文本。<menu>定义命令的列表或菜单。<menuitem>定义用户可以从弹出菜单调用的命令/菜单项目。<meta>定义关于 HTML 文档的元信息。<meter>定义预定义范围内的度量。<nav>定义导航链接。<noframes>定义针对不支持框架的用户的替代内容。<noscript>定义针对不支持客户端脚本的用户的替代内容。<object>定义内嵌对象。<ol>定义有序列表。<optgroup>定义选择列表中相关选项的组合。<option>定义选择列表中的选项。<output>定义输出的一些类型。<p>定义段落。<param>定义对象的参数。<pre>定义预格式文本。<progress>定义任何类型的任务的进度。<q>定义短的引用。<rp>定义若浏览器不支持 ruby 元素显示的内容。<rt>定义 ruby 注释的解释。<ruby>定义 ruby 注释。<s>不赞成使用。定义加删除线的文本。<samp>定义计算机代码样本。<script>定义客户端脚本。<section>定义 section。<select>定义选择列表（下拉列表）。<small>定义小号文本。<source>定义媒介源。<span>定义文档中的节。<strike>不赞成使用。定义加删除线文本。<strong>定义强调文本。<style>定义文档的样式信息。<sub>定义下标文本。<summary>为 <details> 元素定义可见的标题。<sup>定义上标文本。<table>定义表格。<tbody>定义表格中的主体内容。<td>定义表格中的单元。<textarea>定义多行的文本输入控件。<tfoot>定义表格中的表注内容（脚注）。<th>定义表格中的表头单元格。<thead>定义表格中的表头内容。<time>定义日期/时间。<title>定义文档的标题。<tr>定义表格中的行。<track>定义用在媒体播放器中的文本轨道。<tt>定义打字机文本。<u>不赞成使用。定义下划线文本。<ul>定义无序列表。<var>定义文本的变量部分。<video>定义视频。<wbr>定义可能的换行符。<xmp>不赞成使用。定义预格式文本。属性值描述classclassname规定元素的类名（classname）idid规定元素的唯一 idstylestyle_definition规定元素的行内样式（inline style）titletext规定元素的额外信息（可在工具提示中显示）

0 0