1.图像
<img> 标签用于在 HTML 页面中嵌入图像。从技术上讲，实际上并没有将图像插入到网页中，而是将图像链接到了网页。<img> 标签创建了一个容器，用于引用图像。
<img>标签有以下属性：
| 属性名 | 作用 |
|---|---|
| scr | 指定图像的URL、可以是相对路径或绝对路径 |
| alt | 如果由于某种原因无法显示图像，则指定图像的替代文本 |
| width | 指定图像的宽度 |
| height | 指定图像的高度 |
| title | 当鼠标移到元素上时显示一段工具提示文本 |
| align | 指定图像在页面中的对齐方式 |
2.超链接
HTML中的链接是一种用于在不同网页之间导航的元素，通常用于将一个网页与另一个网页或资源（如文档、图像、音频文件等）相关联。
HTML 链接 通过 <a> 标签创建例如：
<a href="URL">链接文本</a>-
<a>标签：定义了一个超链接（anchor）。它是 HTML 中用来创建可点击链接的主要标签。 -
href属性：指定目标 URL，当点击链接时，浏览器将导航到此 URL。
3.列表
HTML 支持有序、无序和定义列表:
无序列表使用 <ul> 标签，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。
<ul>
<li>123</li>
<li>456</li>
</ul>有序列表使用数字进行标记。 有序列表始于 <ol> 标签。每个列表项始于 <li> 标签。
<ol>
<li>123</li>
<li>456</li>
</ol>4.表格
HTML 表格由 <table> 标签来定义。每个表格均有若干行（由 <tr> 标签定义），每行被分割为若干单元格（由 <td> 标签定义），表格可以包含标题行（<th>）用于定义列的标题。代码如下：
<table>
<thead>
<tr>
<th>列标题1</th>
<th>列标题2</th>
<th>列标题3</th>
</tr>
</thead>
<tbody>
<tr>
<td>行1，列1</td>
<td>行1，列2</td>
<td>行1，列3</td>
</tr>
<tr>
<td>行2，列1</td>
<td>行2，列2</td>
<td>行2，列3</td>
</tr>
</tbody>
</table>5.表单
HTML 表单用于收集用户的输入信息，表单通常包含各种输入字段、复选框、单选按钮、下拉列表等元素。
-
<form>元素用于创建表单，action属性定义了表单数据提交的目标 URL。 -
<input>元素是最常用的表单元素之一，它可以创建文本输入框、密码框、单选按钮、复选框等。type属性定义了输入框的类型，id属性用于关联<label>元素，name属性用于标识表单字段。 -
<select>元素用于创建下拉列表，而<option>元素用于定义下拉列表中的选项。
<form action="/submit" method="post">
<input type="text" placeholder="输入框">
<!-- 下拉列表 -->
<select id="country" name="country">
<option value="cn">CN</option>
<option value="usa">USA</option>
<option value="uk">UK</option>
</select>最后使用以上的代码来简单的编写一个HTML页面：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<header><h1 align="center">广东云浮中医药职业学院</h1><p align="center">欢迎来到：<ins>计算机学院</ins></p></header>
<hr>
<nav>
<ul>
<a href="#"><li>首页</li></a>
<a href="#"><li>关于我们</li></a>
<a href="#"><li>学生风采</li></a>
<a href="#"><li>联系方式</li></a>
</ul>
</nav>
<hr>
<main>
<article><h3>最新文章</h3></article>
<section><h4>文章标题</h4></section>
<section>这里是文章的内容简介。<br>可以使用<br>标签进行换行。</section>
<section>
<img src="https://bkimg.cdn.bcebos.com/pic/dcc451da81cb39dbb6fd4a7c79411e24ab18972b9ad8?x-bce-process=image/format,f_auto/watermark,image_d2F0ZXIvYmFpa2UyNzI,g_7,xp_5,yp_5,P_20/resize,m_lfit,limit_1,h_1080"
alt="" width="200" height="200">
</section>
<section>想了解广东云浮中医药职业学院：<a href="./9文本.html">点击这里</a></section>
<aside>
<h4>侧边栏</h4>侧边栏内容，如快速连接、广告等。<br>
<table border="1">
<tr>
<th>专业</th>
<th>链接</th>
</tr>
<tr>
<td>计算机应用技术</td>
<td>
<a href="./9文本.html">专业A详情</a>
</td>
</tr>
<tr>
<td>数字媒体技术</td>
<td>
<a href="./9文本.html">专业B详情</a>
</td>
</tr>
</table>
<br>
<b>联系我们</b><br>
<form action="">
姓名： <input type="text"><br>
邮箱： <input type="text"><br>
<input type="submit">
</form>
</aside>
</main>
<hr>
<footer>版权所有©2024广东云浮中医药职业学院计算机学院</footer>
</body>
</html>运行结果如下：
