一、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" rel="external nofollow" >点击访问网站</a>
在上面的代码中,href属性指定了链接的目标地址,即要跳转到的网页的URL。链接文本是”访问示例网站”,它将在用户点击时显示给用户。
如果我们想要链接到当前页面的某个部分,可以使用相对路径或绝对路径来实现。例如,假设我们有一个名为”section1″的锚点,我们可以这样创建链接:
<a href="#section1" rel="external nofollow" >跳转到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>
在这个例子中,浏览器会将“强调”这个词显示为斜体。