HTML基础

一、HTML标题

HTML标题（Heading）是通过 <h1> - <h6> 标签来定义的。

h是英文header标题的缩写，标题无处不在，它的应用范围十分广泛：网站结构、写作文、PPT 等。

这里有六个标题元素标签 —— <h1>、<h2> 、<h3>、<h4>、<h5>、<h6>，每个元素代表文档中不同级别的内容：

• <h1>表示主标题（ the main heading ），</h1>
• <h2>表示二级子标题（ subheadings ），</h2>
• <h3>表示三级子标题（ sub-subheadings ），</h3>
• <h4>、<h5>、<h6>字体的大小依次递减。

代码示例如下：

<h1>这是一个标题</h1>
<h2>这是一个标题</h2>
<h3>这是一个标题</h3>
<h4>这是一个标题</h4>
<h5>这是一个标题</h5>
<h6>这是一个标题</h6>

二、HTML段落

使用带有标签 <p> 的 HTML 元素可以轻松地将文本添加到页面中，并创建一个新的段落。所有常规文本都应放在 <p> 标签之间。

代码示例如下：

<p>这是一个段落。</p>
<p>这是一个段落。</p>

下面这个实例讲述了标题和段落的结构层次：

<h1>主标题</h1>
<p>这是一个段落</p>
<h2>二级子标题</h2>
<p>这是一个段落</p>
<h2>二级子标题</h2>
<p>这是一个段落</p>
<h3>三级子标题</h3>
<p>这是一个段落</p>

上述实例所涉及的元素具体代表什么，完全取决于作者编辑的内容，只要确保层次结构是合理的就可以。在创建此类结构时，只需要记住以下几点：

• 应该只对每个页面使用一次<h1>，这是主标题，所有其他标题位于层次结构中的下方；
• 请确保在层次结构中以正确的顺序使用标题。不要使用<h3>来表示副标题，后面跟<h2>来表示副副标题，这是没有意义的；
• 在可用的六个标题级别中，应该保证每个页面中标题级别的使用不超过三个，具有许多标题级别的文档会变得杂乱无章；
• 建议将内容分散在多个页面上。

三、HTML链接

HTML中的链接是通过<a>标签来定义的。这个标签也被称为锚点元素，它可以用于实现页面跳转功能，也可以用于内部导航。通过使用<a>标签，我们可以创建一个指向其他网页或当前页面特定部分的链接。

以下是一个简单的示例，展示了如何使用<a>标签创建链接：

<a href="https://www.example.com">点击访问网站</a>

在上面的代码中，href属性指定了链接的目标地址，即要跳转到的网页的URL。链接文本是"访问示例网站"，它将在用户点击时显示给用户。

如果我们想要链接到当前页面的某个部分，可以使用相对路径或绝对路径来实现。例如，假设我们有一个名为"section1"的锚点，我们可以这样创建链接：

<a href="#section1">跳转到section1</a>

在上面的代码中，#符号表示锚点，它告诉浏览器我们要链接到当前页面的"section1"部分。

四、HTML图像

HTML图像是通过<img>标签来定义的。<img>标签用于在网页中插入图像，可以是静态图片、动态图片等。

基本语法如下：

<img src="图像地址" alt="替代文本">

其中，src属性指定了图像的地址，可以是相对地址或绝对地址；alt属性指定了替代文本，当图像无法加载时显示给用户。

例如，插入一张名为"example.jpg"的示例图片：

<img src="example.jpg" alt="示例图片">

在上面的例子中，src属性的值是"example.jpg"，表示要插入的图片文件名；alt属性的值是"示例图片"，当图片无法加载时会显示这个文本。

五、HTML强调

在HTML中，我们可以使用<em>标签来表示斜体文本。例如：

<p>这是一个<em>强调</em>的文本。</p>

在这个例子中，浏览器会将“强调”这个词显示为斜体。