上一篇
HTML入门必备，详细解析如何正确使用各种标签？
HTML（超文本标记语言）是一种用于创建网页的标准标记语言，通过使用HTML标签，我们可以定义网页的结构和内容，以下是一些常用的HTML标签及其使用方法：
基本标签
| 用途 | 示例 | |
|---|---|---|
| <html> | 定义整个HTML文档 | <html> |
| <head> | 包含文档的元数据（如标题、样式等） | <head> |
| <body> | 包含文档的可见内容 | <body> |
| <h1> 至 <h6> | ，<h1> 是最大的标题，<h6> 是最小的标题 | <h1>一级标题</h1> |
| <p> | 定义段落 | <p>这是一个段落。</p> |
| <br> | 换行 | <br> |
文本格式化标签
| 用途 | 示例 | |
|---|---|---|
| <b> | 加粗文本 | <b>加粗文本</b> |
| <i> | 斜体文本 | <i>斜体文本</i> |
| <u> | 下划线文本 | <u>下划线文本</u> |
| <em> | 强调文本 | <em>强调文本</em> |
| <strong> | 强调文本，具有更高的语义 | <strong>强调文本</strong> |
链接标签
| 用途 | 示例 | |
|---|---|---|
| <a> | 创建链接 | <a href="https://www.example.com">链接文本</a> |
| <img> | 插入图片 | <img src="image.jpg" alt="图片描述"> |
列表标签
| 用途 | 示例 | |
|---|---|---|
| <ul> | 无序列表 | <ul> |
| <ol> | 有序列表 | <ol> |
| <li> | 列表项 | <li>列表项</li> |
表格标签
| 用途 | 示例 | |
|---|---|---|
| <table> | 创建表格 | <table> |
| <tr> | 表格行 | <tr> |
| <th> | 表头单元格 | <th> |
| <td> | 标准单元格 | <td> |
表单标签
| 用途 | 示例 | |
|---|---|---|
| <form> | 创建表单 | <form> |
| <input> | 输入字段 | <input type="text" name="username"> |
| <button> | 按钮 | <button type="submit">提交</button> |
其他常用标签
| 用途 | 示例 | |
|---|---|---|
| <div> | 容器元素 | <div> |
| <span> | 容器元素，常用于文本格式化 | <span> |
| <header> | 页面头部 | <header> |
| <footer> | 页面底部 | <footer> |
FAQs
Q1：如何让HTML文档具有响应式设计？
A1：为了实现响应式设计，你可以使用CSS媒体查询来根据不同的屏幕尺寸调整样式。
<style> @media (maxwidth: 600px) { body { backgroundcolor: lightblue; } } </style>
Q2：如何在HTML中插入视频？
A2：你可以使用<video>标签来插入视频，以下是一个示例：
<video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> 您的浏览器不支持视频标签。 </video>
