HTML基本结构
HTML文档由<!DOCTYPE html>
声明开头,定义文档类型为HTML5,主体结构包含<html>
标签,内部分为<head>
(头部)和<body>
(主体)两部分。
<!DOCTYPE>
<html>
<head>
<body>
常用HTML标签
文本与格式
功能 | |
---|---|
<h1>~<h6> |
标题标签,<h1> 为最高层级标题 |
<p> |
段落标签,用于包裹文本块 |
<strong> |
加粗文本(语义化标签,强调内容) |
<em> |
斜体文本(语义化标签,强调内容) |
<br> |
换行符,强制文本换行 |
链接与图片
功能 | |
---|---|
<a> |
超链接,href 属性指定跳转地址(例:<a href="https://example.com">链接</a> ) |
<img> |
图片,src 属性指定图片路径,alt 提供替代文本(例:<img src="image.jpg" alt="示例图片"> ) |
列表
功能 | |
---|---|
<ul> |
无序列表,子项用<li> 包裹 |
<ol> |
有序列表(数字/字母排序) |
<li> |
列表项,可嵌套其他列表 |
表格与表单
表格 (<table>
)
功能 | |
---|---|
<table> |
表格容器 |
<tr> |
表格行 |
<th> |
表头单元格(通常加粗) |
<td> |
表格数据单元格 |
示例:
<table border="1"> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr> <td>张三</td> <td>25</td> </tr> </table>
表单 (<form>
)
功能 | |
---|---|
<form> |
表单容器,action 指定提交地址,method 指定提交方式(GET/POST) |
<input> |
输入框,type 属性定义类型(文本、密码、按钮等) |
<textarea> |
多行文本输入框 |
<select> |
下拉菜单,<option> 定义选项 |
示例:
<form action="/submit" method="post">
用户名: <input type="text" name="username"><br>
密码: <input type="password" name="password"><br>
<input type="submit" value="登录">
</form>
常见问题与解答
问题1:<img>
标签的alt
属性有什么作用?
解答:alt
属性用于在图片无法加载时显示替代文本,同时帮助屏幕阅读器描述图片内容,提升无障碍访问体验。<img src="logo.png" alt="网站Logo">
。
问题2:为什么有些HTML标签需要闭合,而有些不需要?
解答:
- 需要闭合的标签(如
<div>
、<p>
):称为“双标签”,必须成对出现,包裹内容。 - 不需要闭合的标签(如
<img>
、<br>
):称为“单标签”,独立使用,内容单一(如图片、换行)。
未正确闭合